Skip to content

I
interview
Commit eaca008b by jiangqifan
Options

add frontend

parent 2b6792c1
Showing with 414 additions and 0 deletions
.gitignore 0 → 100644
*.DS_Store
frontend/index.md 0 → 100644
#前端面试
## HTML 与 CSS 基础
> 通过这部分的问题，了解面试这对于网页开发的基础知识掌握情况。目前大部分前端人员应该都经历过纯手写html,css的阶段，所以对这一部分应该都能答上来。
### 行内元素有哪些？块级元素有哪些？ 空(void)元素有那些？
> 行内元素: span, a, img,
>
> 块级元素: div,ul,p,table,h1,h2
> 备注:
>
> 本题是个热身， 主要看看他平时是不是经常写代码，如果这个问题一个都答不上来的话，就很可疑了。优秀的人会通过这个问题，顺便说到块级元素与行内元素的区别，以及块级元素和行内元素之间的转换。如果他没有主动提及，也可以主动问。
### 介绍一下你对浏览器内核的理解？常见的浏览器内核有哪些？
> ‎Trident： IE
>
> Gecko: firefox
>
> ‎Webkit: safari
>
> Blink: chrome
### 请描述一下 cookies，sessionStorage 和 localStorage 的区别？ 作用，存储大小，有效时间
> cookie 存储空间比较小，可以在http请求头中带上，在服务器与客户端之间传递
>
> sessionStorage 会在浏览器窗口关闭之后失效
>
> localStorage 如果不手动清楚会一直有效
### 如何实现浏览器内多个标签页之间的通信?
>通过服务器中转, WebSocket/轮询等
>
>localstorge
>
>SharedWorker
### webSocket如何兼容低浏览器？
> 长轮询
### 介绍一下标准的CSS的盒子模型？低版本IE的盒子模型有什么不同的？
>（1）有两种， IE 盒子模型、W3C 盒子模型；
（2）盒模型： 内容(content)、填充(padding)、边界(margin)、 边框(border)；<u>重要</u>
（3）区 别： IE的content部分把 border 和 padding计算了进去 (<u>这个说不说的上来不重要</u>)
### display有哪些值？说明他们的作用
>inline
>block
>block-inline
### float的作用？有什么 副作用?如何清除浮动?
> 脱离文档流, 常用: float: left, float: right
>
> 副作用: 父元素塌陷
>
> 清除: 使用清楚浮动的方式解决浮动元素的父元素塌陷的问题
>
> ```
> .clearfix:after {
> visibility: hidden;
> display: block;
> font-size: 0;
> content: " ";
> clear: both;
> height: 0;
> }
> ```
>
>
### 常用CSS选择符有哪些？
> 标签选择符, 类选择符, id选择符等
CSS优先级算法如何计算？
> 内联的style, 权值为1000 > id, 权值为100 > (代表类、伪类和属性选择器) 权值为 10 > tag, 权值为1
position的值relative和absolute有什么区别？
经常遇到的浏览器的兼容性有哪些？原因，解决方法是什么？
> 通过此问题可以看出来面试者平时工作中是否有过处理兼容性问题的经验和思路
使用 CSS 预处理器吗？了解其他的吗？ 有什么区别？
> sass, less
> 此题考查面试者知识面，以及平时是否会对技术保持敏感
什么是响应式设计？响应式设计的基本原理是什么？如何兼容低版本的IE？
> @media 使用媒体查询检查窗口大小，然后使用不同的布局
flex布局
> 如果能说上来可以加分
## Javascript
### 介绍js的常用类型, 以及如何判断数据类型
> Bool, Number, String, Null,Undefined,Symbol（ES6中提供）
>
> Object也是常用的类型，但是不是基础类型
>
> 类型推断: instanceof typeof
> 考察面试者js基础，Bool,Number,String，必须得能说出来，类型推断至少要提到instanceof和typeof
### 类型转换
> 隐式转换: 用==判断式会出发隐式转换, 具体的转化规则可以问一下，能说清楚的加分，说不清楚也关系不大
>
> 显示转换:
### 值类型和引用类型
> 值传递与引用传递
>
> 这个问题也可以引出const的问题
### JavaScript原型，原型链 ? 有什么特点？
> 每个对象有.\_\_proto\_\_属性, 是此对象的原型对象。
>
> ```
> var pro = {
> name: 123
> }
> var a = {};
> a.__proto__ = b;
>
> console.log(a.name); // 123
>
> // 当访问对象a的name属性时，如果如果a没有name属性，会从他的原型
> //对象上去找，如果原型对象上也没有，就从原型对象的原型对象上去找，
> //直到找到没有原型对象为止。
>
> //对象有原型对象，原型对象还有原型对象，形成的这个链条就叫原型链
>
> ```
Javascript如何实现继承？
> 借助原型链来实现方法属性的继承
>
> 借助函数的call或者apply方法来实现在子类的方法中调用父类的方法
Javascript作用链域?
>全局作用域
>
>方法作用域
>
>```
>function test(){
> var i = 0;
> while(i++ > 10){
> var a = 2;
> }
> console.log(a) //不会报错
>}
>
>```
>
>
>
>块级作用域
>
>```
>var i = 0;
>while(i++ < 2){
> let a = 2;
>}
>console.log(a) //报错a is not defined
>
>```
变量提升
​ 在函数作用域内，用var声明的变量都会提升到函数的开头。
​ 所以在函数第一行就可以使用函数内所有用var定义的变量，不会报错，但是由于赋值语句还没有执行，所以不会有值。
> ```
>
> function test(){
> console.log(a) //不会报错, 输出undefined
> var i = 0;
> while(i++ > 10){
> var a = 2;
> }
>
> }
>
> ```
>
>
### 什么是闭包（closure），为什么要用它？
> 闭包的原理: 函数执行时可以使用函数定义时的作用域。
>
> 用途:
>
> - 做私有变量，避免其他方式访问此变量
> - 使用函数定义时的的作用域中的对象
### 谈谈This对象的理解。
> 全局上下文:
>
> - 在全局执行上下文中，this是全局对象，（浏览器中是window, node里是global）
>
> 函数上下文:
>
> - 普通的函数调用时,如 `(function(){console.log(this)})()`，如果不是严格模式，this为window或者global; 如果是严格模式，this为undefined
>
> - 用call或者apply可以指定函数执行时的this对象
> - 通过bind固定函数的this对象，之后正常执行这个函数，this就是之前绑定的对象
> - [ES6]箭头函数中的this与当前函数外定义时的上下文中的this对象相同
> - 作为对象的方法调用, this 为该对象
> - 某对象a的原型链中某个对象上的方法执行时，this为原型链头上的那个对象a
> - 用new调用构造函数时，this为新创建出来的那个对象
> - 作为dom事件处理函数被调用时, this为触发事件的元素
> - 作为内联事件处理函数被调用时，this为监听器所在的dom元素
eval是做什么的？
> 将一个字符串当作js代码执行
>
> 一般不推荐使用
>
> //# sourceURL=xxx, 通过这种方式可以执行执行的代码的源码，方便调试
null，undefined 的区别？
> null 是值为空，undefined是没有值
函数式编程，map，reduce, filter
### 如何判断一个对象是否具有指定名称的属性
> hasOwnProperty。
>
> 此方法无法检查该对象的原型链中是否具有该属性；该属性必须是对象本身的一个成员
### 浮点数陷阱
>0.1 + 0.2 不等于 0.3
### 说几条写JavaScript的代码规范？
​ 1.不要在同一行声明多个变量。
​ 2.请使用 ===/!==来比较true/false或者数值
​ 3.使用对象字面量替代new Array这种形式
​ 4.不要使用全局函数。
​ 5.Switch语句必须带有default分支
​ 6.函数不应该有时候有返回值，有时候没有返回值。
​ 7.For循环必须使用大括号
​ 8.If语句必须使用大括号
​ 9.for-in循环中的变量 应该使用var关键字明确限定作用域，从而避免作用域污染。
>考察面试者的代码质量意识
同步和异步的区别?
### 如何解决跨域问题?
> jsonp
>
> cors
>
> 代理
### 几种常见的模块化方式
> commonJS
>
> AMD
>
> CMD
### es6，箭头函数，ES6是如何实现编译成ES5的？
call() 和 .apply() 的区别？
哪些操作会造成内存泄漏？
Node.js的适用场景？
检测浏览器版本版本有哪些方式？
## Vue
vue的使用场景
vue的生命周期
> beforeCreated
>
> created
>
> beforeMount
>
> mounted
>
> beforeUpdate
>
> updated
>
> beforeDestroy
>
> destroyed
谈谈vue对于mvvm的实现
> 使用 Object.defineProperty的方式监听数据变化，然后计算虚拟dom的变化，同步到真实dom中
数据传递
refs
### v-model
用于实现双向绑定
> v-model = v-bind:value + emit('input')
什么时候适合用methods，什么时候适合用computed，什么时候适合用watch。
事件修饰符
scoped的作用
> 让css只在当前组件中有效, 防止css冲突
### 嵌套路由怎么定义？
> 在 VueRouter 的参数中使用 children 配置
### 怎么定义vue-router的动态路由？怎么获取传过来的动态参数？
> 设置路由时，对path属性加上/:id。
>
> 使用router对象的params.id。
### vue-router有哪几种导航钩子？
> 第一种：是全局导航钩子：
>
> ​ router.beforeEach(to,from,next)，作用：跳转前进行判断拦截。
>
> ​ router.afterEach()
>
> 第二种：组件内的钩子
> 第三种：单独路由独享组件
### vuex是什么？怎么使用？哪种功能场景使用它？
> 状态管理
>
> 应用级的状态集中放在store中； 改变状态的方式是提交mutations，这是个同步的事物； 异步逻辑应该封装在action中。
scoped的实现原理
data
组件化思维
进阶:
公用方法mixin处理
全局状态该如何存储
Vuex的优点
如何自定义组件的指令
内置组件
vue是如何通过使用webpack进行测试和生产环境进行一个构建
webpack 的作用
babel 的作用
一些常见坑的解法，比如this用法，比如nextTick，比如Vue.set
样式修改，主题样式定制
与后端联动 vue-resource/axios/juqery？
element-ui
react 和 vue的区别？
## 综合
### 你遇到过比较难的技术问题是？你是如何解决的？
### http状态码有那些？分别代表是什么意思？
### 前端性能优化思路
> 减少体积: 压缩, cdn，雪碧图, 合理使用缓存
>
> 优化渲染: js写在最后面, 图片懒加载, ssr，减少dom操作（合并操作，缓存查询结果）
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment