百度社招前端工程师面试经历

一面

1、讨论项目相关的细节

2、vue 响应式原理。

（1）意思就是在改变数据的时候，视图会跟着更新。这意味着你只需要进行数据的管理，给我们搬砖提供了很大的便利。React也有这种特性，但是React的响应式方式跟VUE完全不同。React是通过this.setState去改变数据，然后根据新的数据重新渲染出虚拟DOM，最后通过对比虚拟DOM找到需要更新的节点进行更新。也就是说React是依靠着虚拟DOM以及DOM的diff算法做到这一点的。

（2）第一步：组件初始化的时候，先给每一个Data属性都注册getter，setter，也就是reactive化。然后再new 一个自己的Watcher对象，此时watcher会立即调用组件的render函数去生成虚拟DOM。在调用render的时候，就会需要用到data的属性值，此时会触发getter函数，将当前的Watcher函数注册进sub里。

（3）第二步：当data属性发生改变之后，就会遍历sub里所有的watcher对象，通知它们去重新渲染组件。

3、什么是 mvvm？

4、es6 使用过的特性

5、flex 常见的属性

（1）justify-content属性：定义项目在主轴上的对齐方式

      ①justify-content: center;   //居中排列

      ②justify-content: flex-start;  // 左对齐

      ③justify-content: flex-end;  //右对齐

      ④justify-content: space-between;  //中间均分，两端对齐

（2）flex-direction属性：决定主轴的方向（即项目的排列方向）

      ①flex-direction: row  //从左到右

      ②flex-direction: row-reverse  //从右到左

      ③flex-direction: column  //从上到下

      ④flex-direction: column-reverse  //从下到上

6、css 选择器的优先级

（1）CSS优先级：是由四个级别和各级别的出现次数决定的。四个级别分别为：行内选择符、ID选择符、类别选择符、元素选择符。

（2）优先级的算法：

      每个规则对应一个初始"四位数"：0、0、0、0

      若是 行内选择符，则加1、0、0、0

      若是 ID选择符，则加0、1、0、0

      若是 类选择符/属性选择符/伪类选择符，则分别加0、0、1、0

      若是 元素选择符/伪元素选择符，则分别加0、0、0、1

      算法：将每条规则中，选择符对应的数相加后得到的”四位数“，从左到右进行比较，大的优先级越高。

7、抽取过哪些 vue 组件？

二面

1、讲项目

2、express 设计原理，面试官对动态路由匹配一直追问下去，但是这里的源码设计我确实是忘了，一路讨论下去扯到了字符串的前缀树...

3、实现一个事件发布订阅类，其实就是 eventEmitter

三面

聊了一些业务上的事情