第22题：介绍下重绘和回流（Repaint&Reflow），以及如何进行优化？
答：关于重绘和回流
第23题：介绍下观察者模式和订阅-发布模式的区别，各自适用于什么场景？
第24题：聊聊Redux和Vuex的设计思想？
答：
把组件之间需要共享的状态抽取出来，遵循特定的约定，统一来管理，让状态的变化可以预测。
组件不允许直接修改属于store实例的state，组件必须通过action来改变state
第25题：说说浏览器和Node事件循环的区别？
答：
其中一个主要区别在于浏览器的event loop和nodejs的event loop在处理异步事件的顺序上是不同的。nodejs中有micro event;其中promise属于micro event，该异步事件的处理顺序就和浏览器不同。
nodejs v11.0以上版本，这两者之间的顺序就相同了。
第26题：介绍模块化发展历程
模块化是用来抽离公共代码，隔离作用域，避免变量冲突等。
IIFE：使用自执行函数来编写模块化，特点：在一个单独的函数作用域中执行代码，避免变量冲突。
AMD：使用requireJS来编写模块化，特点：依赖必须提前声明好。
CMD：使用seaJS来编写模块化，特点：支持动态引入依赖文件。
CommonJS：nodejs中自带的模块化
UMD：兼容AMD，CommonJS模块化语法
webpack(require.ensure)：webpack 2.x版本中的代码分割
ES Modules：ES6引入的模块化，支持import来引入另一个js
第27题：全局作用域中，用const和let声明的变量不在window上，那到底在哪里？如何去获取？
答：
在ES5中，顶层对象的属性和全局变量是等价的，var命令和function命令声明的全局变量，自然也是顶层对象。
但ES6规定，var命令和function命令声明的全局变量，依旧是顶层对象的属性，但let命令、const命令、class命令声明的全局变量，不属于顶层对象的属性。
在哪里？在一个块级作用域（Script）里
怎么获取？在它所在的作用域中直接获取，比如，let a = 0; console.log(a)
第28题：cookie和token都存放在header中，为什么不会劫持token?
答：浏览器会自动带上cookie，不会自动带上token
第29题：聊聊Vue的双向数据绑定，Model如何改变View,View又是如何改变Model的？
答：核心是利用ES5的Object.defineProperty
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-UA-Compatible" content="ie=edge"> <title>Document</title> </head> <body> <input id="input" type="text"> <div id="text"></div> <script> let input = document.getElementById("input") let text = document.getElementById("text") let data = { value: "" } Object.defineProperty(data, "value", { set: function (val) { text.innerHTML = val; input.value = val; }, get: function () { return input.value } }); input.onkeyup = function (e) { data.value = e.target.value; } </script> </body> </html>
第30题：两个数组合并成一个数组
var arr1 = ['A1', 'A2', 'B1', 'B2', 'C1', 'C2', 'D1', 'D2']; var arr2 = ['A', 'B', 'C', 'D']; var arr3 = arr2.map(item => item + 3) var arr4 = [...arr1, ...arr3].sort().map(item => { if (item.includes('3')) { return item.split('')[0] } return item; }) console.log(arr4); // ['A1', 'A2', 'A', 'B1', 'B2', 'B', 'C1', 'C2', 'C', 'D1', 'D2', 'D']
代码来自：https://github.com/Advanced-Frontend/Daily-Interview-Question/issues/39#issuecomment-471380860
参考文章：https://juejin.im/post/5d23e750f265da1b855c7bbe#heading-25