原创 2020年Web前端JavaScript面试题整理附答案

很快又要到一年一度的秋招热季，大家都准备好面试了吗？本文为大家整理了2020年最新出炉的Web前端JavaScript面试题，大家可以好好做一做，有什么不懂得地方再看答案，下面一起来查漏补缺吧！

面试题1：Object.is()与原来的比较操作符"==="、"==” 的区别？

答案：

（1）两等号判等，会在比较时进行类型转换；

（2）三等号判等(判断严格)，比较时不进行隐式类型转换，(类 型不同则会返回false)；

（3）Object.is 在三等号判等的基础上特别处理了NaN、-0和+0，保证-0和+0不再相同，但

Object.is(NaN, NaN)会返回true。Object.is应被认为有其特殊的用途，而不能用它认为它比其它的相等对比更宽松或严格。

面试题2：common.js和es6中模块引入的区别？

答案：

CommonJS是一种模块规范， 最初被应用于Nodejs, 成为Nodejs的模块规范。运行在浏览器端的JavaScript由于也缺少类似的规范，在ES6出来之前，前端也实现了一套相同的模块规范(例如: AMD)，用来对前端模块进行管理。自ES6起，引入了一套新的ES6 Module规范，在语言标准的层面.上实现了模块功能，而且实现得相当简单，有望成为浏览器和服务器通用的模块解决方案。但目前浏览器对ES6 Module兼容还不太好，我们平时在Webpack中使用的export和import，会经过Babel转换为CommonJS规范。在使用上的差别主要有：

CommonJS 模块输出的是一个值的拷贝， ES6 模块输出的是值的引用；

CommonJS模块是运行时加载，ES6 模块是编译时输出接口；

Common]s 是单个值导出，ES6 Module可以导出多个；

Common]s是动态语法可以写在判断里，ES6 Module静态语法只能写在顶层。

面试题3：JavaScript有几种方法判断变量的类型?

答案：

（1）使用typeof检测当需要判断变量是否是number, string, boolean, function, undefined等类型时，可以使用typeof进行判断。

（2）使用instanceof检测instanceof运算符与typeof运算符相似，用于识别正在处理的对象的类型。与typeof方法不同的是，instanceof 方法要求开发者明确地确认对象为某特定类型。

（3）使用constructor检测constructor本来是原型对象上的属性，指向构造函数。但是根据实例对象寻找属性的顺序，若实例对象上没有实例属性或方法时，就去原型链上寻找，因此，实例对象也是能使用constructor属性的。

面试题4：请你谈谈Cookie的弊端。

答案：

（1）Ccookie数量和长度的限制。每个domain最多只能有20条cookie，每个cookie长度不能超过4KB，否则会被截掉。

（2）安全性问题。如果cookie被 人拦截了，那人就可以取得所有的session信息。即使加密也与事无补，因为拦截者并不需要知道cookie的意义，他只要原样转发cookie就可以达到目的了。

（3）有些状态不可能保存在客户端。例如，为了防止重复提交表单，我们需要在服务器端保存一个计数器。如果我们把这个计数器保存在客户端，那么它起不到任何作用。

面试题5：浏览器是怎样解析CSS选择器的？

答案：

CSS选择器的解析是从右向左解析的。若从左向右的匹配，发现不符合规则，需要进行回溯，会损失很多性能。若从右向左匹配，先找到所有的最右节点，对于每一个节点，向上寻找其父节点直到找到根元素或满足条件的匹配规则，则结束这个分支的遍历。两种匹配规则的性能差别很大，是因为从右向左的匹配在第一步就筛选掉了大量的不符合条件的最右节点(叶子节点)，而从左向右的匹配规则的性能都浪费在了失败的查找上面。而在 CSS解析完毕后,需要将解析的结果与DOM Tree的内容-起进行分析建立-棵Render Tree，最终用来进行绘图。在建立Render Tree时(WebKit 中的「Attachment」过程)， 浏览器就要为每个DOM Tree中的元素根据CSS的解析结果(Style Rules)来确定生成怎样的Render Tree。

关于2020年Web前端JavaScript面试题就整理到这里了，大家都能全部写出答案吗？如果不能，说明关于JavaScript的知识点还是有死角，得好好梳理复习一下。