金山办公2020校招前端开发工程师笔试题（一）

第一题
[] == [] 输出的结果是？为什么？

结果：false
原因：数组的存储是堆空间，所以数组的标识存放的只是对应数据的地址值，所以数组之间都不完全相等，题目中的两个数组只是值相等，地址值不同。

 

第二题
请说出三种减少网页加载时间的方法。

服务器角度

1. 采取CDN加速 
2. 开启gzip压缩 
3. 允许使用强缓存或协商缓存 
4. 增加服务器带宽 

客户端角度

1. 合理组织CSS、JavaScript代码位置 
2. 减少DOM操作、添加事件委托 
3. 部分操作可设置防抖和节流 
4. 对于可预见的操作采取preload或prerender的预加载 
5. 对于图片可以懒加载 
6. 合并CSS图片（精灵图/雪碧图） 
7. 减少使用iframe 

资源优化打包角度

1. 使用打包工具将Js文件、CSS文件和静态文件进行恰当打包处理。

引用自 https://blog.csdn.net/qq_40781291/article/details/104685358

 

第三题
请问什么情况下会遇到跨域问题？

当协议、域名、端口号与当前的不同时就会出现跨域问题

 

第四题
http协议中与资源缓存相关的协议头有哪些？

通用首部

1. Cache-Control: HTTP/1.1+控制缓存的协议头 
2. pragma：HTTP/1.1版本之前控制缓存的协议头 

实体首部  

1. expires: 实体主题过期的时间

第五题
CSS中box-sizing有哪些值?区别是什么?

值	区别
content-box	这是由 CSS2.1 规定的宽度高度行为。 宽度和高度分别应用到元素的内容框。 在宽度和高度之外绘制元素的内边距和边框。
border-box	为元素设定的宽度和高度决定了元素的边框盒。 就是说，为元素指定的任何内边距和边框都将在已设定的宽度和高度内进行绘制。 通过从已设定的宽度和高度分别减去边框和内边距才能得到内容的宽度和高度。
inherit	规定应从父元素继承 box-sizing 属性的值。

参考：https://www.w3school.com.cn/cssref/pr_box-sizing.asp

 

第六题
DOM Tree与Render Tree之间的区别是什么?

Dom Tree 包含了所有的HTMl标签，包括display：none  ，JS动态添加的元素等。 

Dom Tree 和样式结构体结合后构建呈现Render Tree。Render Tree 能识别样式，每个node都有自己的style，且不包含隐藏的节点（比如display : none的节点）。

 

第七题
在Javascript中什么情况下会进行装箱/拆箱转换?

在Javascript中出现 基本数据类型数据 和 引用数据类型数据要进行转换的情况下会进行装箱/拆箱操作。

第八题
写出下列代码的执行结果：

new Promise((resolve) => {
console.log('1')
resolve()
console.log('2')
}).then(() => {
console.log('3')
})
setTimeout(() => {
console.log('4')
})
console.log('5')

1 、2、 5 、3、 4

第九题（编程题）
计算一个整数的二进制表示中连续出现1最多的次数。比如13的二进制是：1101，那么他的二进制表示中连续出现的1最多为2次，所以答案就是2。