前端面试题积累（欢迎纠正与解决问题）

问题

1. 什么是BFC

块级化上下文. Block Formatting Context

2. 常用选择器及其优先级

内嵌（style）> ID > 类（class）>伪类（:link :visited :hover :active）> 标签 > 继承（:nth-child(n) ）> 通配符（ > - ）

3. 谈谈flex布局/盒子布局

伸缩性方向：flex-direction:row/column/row-reverse/column-reverse
伸缩性换行: flex-wrap:nowrap/warp/warp-reverse
主轴对齐: justify-context:flex-start/flex-end/centre/space-around/space-between
侧轴对齐：align-items:flex-start/flex-end/centre/stretch

4. 对包装对象的理解

所谓“包装对象”，就是分别与数值、字符串、布尔值相对应的Number、String、Boolean三个原生对象。这三个原生对象可以把原始类型的值变成（包装成）对象。

var v1 = new Number(123);
var v2 = new String("abc");
var v3 = new Boolean(true);

上面代码根据原始类型的值，生成了三个对象，与原始值的类型不同。这用typeof运算符就可以看出来。
5. js new的时候有什么作用

在JavaScript中,new是一个关键字,创建了一个对this的绑定.

• 调用函数
• 自动创建一个新对象
• 将创建的对象和this进行绑定
• 如果构造函数没有显式的返回值,隐式的返回this对象

6. 谈谈对继承extends与原型链的理解
JS的原型链继承的本质是根据__proto__一层一层往上找
继承的时候只需要把子类的原型对象prototype里的__proto__属性指向父类的prototype

7. 小程序的开发流程

1. 需求调研和梳理
2. 产品的设计和审核
3. UI设计和审核
4. 分解开发任务和日期
5. 开发与联调
6. 小程序的测试及修改bug

8. HTTP与HTTPS 基本概念

HTTP：网络协议，是客户端和服务端请求和回应的标准。
作用： 用于www服务器传输超文本到本地浏览器的传输协议。可以使浏览器更加高效使用网络传输减少。
HTTPS：是以安全为目标的HTTP通道。
作用：建立信息安全通道，保证数据传输安全。确认网站的真实性

9. 前端性能优化的方法

1. 减少HTTP请求
2. 使用服务器端渲染
3. 静态资源使用内容分发网络（CDN）
4. 压缩文件，图片优化
5. 将 CSS 放在文件头部，JavaScript 文件放在底部
6. 使用字体图标 iconfont 代替图片图标

10. vue的双向绑定原理与实现
定义：即数据与视图的响应式设计。具体表现为：View的改变能实时让Model发生变化，而Model的变化也能实时更新View。

<input v-model="xxx">

<!-- 上面的代码等价于 -->
<input :value="xxx" @input="xxx = $event.target.value">
<!-- 双向绑定 = 单向绑定 + UI事件监听 -->