如何做一个合格的Web前端面试官（面试者）
最近面试不少，自己作为某易的前端TL面试官，也作为某鹅某巴等的面试者，总结了一些大厂以及小公司2020年的面试经验。希望对你有用！
该文仅针对WEB前端工程师岗位（ !TeamLeader ）。文内具体实现方式请自行度娘/GG（或等我发原创）
…
…
进入正题-2021.1.6 持续更新
一面/平级面（基本必考）
Vue
1、Vue的函数式组件是什么？
2、关于Vue的$set，怎么用的？会改变watch监听的对象或者数组吗？
3、Vue3.0有哪些优化的点？
- Vue3.0使用Proxy进行响应式的监听(默认行为数据处理/多次触发set/Proxy只能代理一层)
- 模板编译和virtual DOM runtime 性能方面的优化
- 关于Vue和diff比较方面的优化
4、Promise如何解决回调地狱
网络协议相关
1、Http底层、TCP/IP协议、TCP、UDP区别；
2、客户端通讯，Client Server；
3、http1.1新增、http2.0新增、http头部属性；
4、http和https的区别；
5、http和https的不对称加密是如何进行的；
6、http的headers都有哪些属性？作用分别是什么？
（cache-control,expires,connection,last-modify,if-modified-since,etag,if-none-match,cookie,accept-ranges,content-type…）
Node
1、Node的中间件是什么；
面向对象
1、对象的深拷贝；
- JSON.parse & JSON.stringify
- Object.create
- $.extends方法
- loadash中的深拷贝
2、toString()
- {}.toString()，会报错的原因
ES6
基本特性？遍历方式？
1、Set、WeakSet数据结构；
2、Map、WeakMap数据结构；
3、Proxy、Object.defineProperty差异；
H5与原生App通信
1、JSBridge
2、离线包的加载问题
3、热更新的问题
项目与实操
1、如何做断点续传；
2、从一次网页请求，到渲染完成，经历了哪些阶段
- 输入域名，先进行域名解析，使用DNS协议，获取对应的IP地址
- 这个IP地址可能不相同，不同地区用户一般访问一个资源，先去CDN托管上找
- 如果在CDN上没有找到该资源，该主机会向*服务器加载对应的资源，这个资源会缓存在CDN上，以后该地区的所有用户，都会享受该福利
- 首先会拿到html文件
- 浏览器自上而下解析html文件
- html中加载其他资源，最终页面渲染完成
3、浏览器渲染DOM的过程
- 处理HTML标记并标记为DOM树
- 处理CSS标记并标记为CSSOM树
- 将DOM和CSSOM合并形成一个渲染树
- 根据渲染树来布局，计算每个节点的几何信息
- 将各个节点绘制到屏幕上
跳链大神支招
4、阻塞问题方式
- css是阻塞渲染的
- javascript加载，是阻塞型的
- async和defer是解决js阻塞最好的的方式
5、前端如何做监控和埋点sdk
- 性能监控&异常监控
- 第三方jssdk埋点统计用户uv pv 事件等行为分析，不能保证网站数据安全。
6、如果作视频和音频的优化，以及兼容问题
二面/TL或主管面
性能如何优化？
1、体积：体积压缩、代码切割、js代码懒加载；
2、缓存：资源的请求设置缓存，cookie减肥，前端静态资源缓存策略[超链]；
3、网络传输：CDN网络加速；
4、预解析DNS，预先告知浏览器某些资源可能在将来会被使用到；
5、图片：图片懒加载技术，雪碧图技术（CSS Sprite）；
6、webview：打成离线包，在webview创建阶段进行预加载；
富文本编辑器
1、一个富文本编辑器如何实现？
项目打包
1、项目打包，内部发生了哪些过程；
2、webpack插件的执行流程是怎么样的；
CDN托管加速的原理
1、*服务器，每次代码更新，需要部署在*服务器上；
2、托管服务器，用户量过大，为了缓解*服务器的压力，很多资源会放到托管服务器上，用户进行资源加载的时候，优先从托管服务器加载；
3、用户解析一个域名，会得到一个ip地址，这个ip一般就是离你最近的cdn托管服务器，在这个服务器上下载你的资源，如果资源不存在，这个托管服务器会自动去往*服务器下载；
Weex渲染机制、Flutter渲染机制的区别
1、…
跨域代理，cookie如何传输？
1、…
WEB安全是什么？什么叫CSRF？
1、XSS（跨站脚本攻击）- 非持久型和持久型；
2、CSRF（跨站请求伪造）；
3、点击劫持；
4、URL跳转漏洞；
5、SQL注入；
6、OS命令注入攻击；
7、cookie安全问题
React
1、虚拟DOM在react和vue中的区别
2、diff算法在react和vue中的区别
三面/总监面
哪个项目是你当前做的比较满意的项目？攻克的难点是什么？
主要考察面试者对新项目、新业务，对过往项目的认可度认同感，解决问题的思路，是否有亮点。
如何进行跨部门沟通合作，以及抢功劳如何调解（大企）
大厂考验沟通能力，以及职场情商的考核。
四面/HR面
该处请自行度娘和GG…
本文地址：https://blog.csdn.net/ht370671963/article/details/112250510