58集团2017前端工程师笔试试题

一、填空题

1、http协议中设置前端缓存的属性有哪些？

答：Cache-Control、Expires、Last-Modified、If-Modified-Since

2、node.js的核心模块有哪些？

答：全局对象、常用工具util、events模块、文件系统fs、HTTP服务器与客户端

3、列举几种常见的设计模式

答：单例模式：任意对象都是单例，无须特别处理；

工厂模式：就是同样形式参数返回不同实例；

代理模式：就是新建个类调用老类的接口，包一下；

观察者模式：就是事件模式，比如按钮的onclick这样的应用。

4、React组件周期的主要方法

答：组件的生命周期可分为三个状态：

• Mounting：已插入真实 DOM
• Updating：正在被重新渲染
• Unmounting：已移出真实 DOM

生命周期的方法有：

componentWillMount 在渲染前调用,在客户端也在服务端。

componentDidMount : 在第一次渲染后调用，只在客户端。

componentWillReceiveProps 在组件接收到一个新的prop时被调用。

shouldComponentUpdate 返回一个布尔值。在组件接收到新的props或者state时被调用。

componentWillUpdate在组件接收到新的props或者state但还没有render时被调用。

componentDidUpdate 在组件完成更新后立即调用。

componentWillUnmount在组件从 DOM 中移除的时候立刻被调用。

5、rem相对于__根元素__，em相对于__父元素__?

答：px像素（Pixel）。相对长度单位。像素px是相对于显示器屏幕分辨率而言的。

em是相对长度单位。字体大小是根据父元素字体大小设置的。

rem是CSS3新增的一个相对单位。rem的大小是根据html根目录下的字体大小进行计算的。当我们改变根目录下的字体大小的时候，下面字体都改变。rem不仅可以设置字体的大小，也可以设置元素宽、高等属性。

二、简答题

1、闭包的原理和应用场景

 答：闭包就是能够读取其他函数内部变量的函数。由于在javascript中，只有函数内部的子函数才能读取局部变量，所以说，闭包可以简单理解成“定义在一个函数内部的函数“。

闭包的两个最大的用处：一个是可以读取到函数内部的变量，另一个就是保护局部变量不被垃圾回收机制销毁，能够被继续使用。

应用场景：使用闭包代替全局变量；在函数外或在其它函数中访问某一函数内部的参数；在函数执行之前为要执行的函数提供具体参数；在函数执行之前为函数提供只有在函数执行或引用时才能知道的具体参数；为节点循环绑定click事件，在事件函数中使用当次循环的值或节点，而不是最后一次循环的值或节点；暂停执行；包装相关功能。

2、js实现异步编程的几种方式

答：回调函数：回调函数的优点是简单、容易理解和部署，缺点是不利于代码的阅读和维护，各个部分之间高度耦合（Coupling），流程会很混乱，而且每个任务只能指定一个回调函数。

事件监听：任务的执行不取决于代码的顺序，而取决于某个事件是否发生。这种方法的优点是比较容易理解，可以绑定多个事件，每个事件可以指定多个回调函数，而且可以"去耦合"（Decoupling），有利于实现模块化。缺点是整个程序都要变成事件驱动型，运行流程会变得很不清晰。

发布/订阅：我们假定，存在一个"信号中心"，某个任务执行完成，就向信号中心"发布"（publish）一个信号，其他任务可以向信号中心"订阅"（subscribe）这个信号，从而知道什么时候自己可以开始执行。这就叫做"发布/订阅模式"（publish-subscribe pattern），又称"观察者模式"（observer pattern）。这种方法的性质与"事件监听"类似，但是明显优于后者。因为我们可以通过查看"消息中心"，了解存在多少信号、每个信号有多少订阅者，从而监控程序的运行。

Promises对象：Promises对象是CommonJS工作组提出的一种规范，目的是为异步编程提供统一接口。它的思想是，每一个异步任务返回一个Promise对象，该对象有一个then方法，允许指定回调函数。这样写的优点在于，回调函数变成了链式写法，程序的流程可以看得很清楚，而且有一整套的配套方法，可以实现许多强大的功能。而且，它还有一个前面三种方法都没有的好处：如果一个任务已经完成，再添加回调函数，该回调函数会立即执行。所以，你不用担心是否错过了某个事件或信号。这种方法的缺点就是编写和理解，都相对比较难。

3、冒泡和捕获通过那哪些方法管理，怎样阻止传播？

答：阻止事件冒泡、捕获的方法：e.stopPropagation();

阻止默认事件发生的方法：e.preventDefault();

4、prototype和__proto__的区别和关系

答：_proto_是每个对象都有的一个属性，而prototype是函数才会有的属性。每个对象都会在内部初始化一个__proto__属性，当我们访问一个对象的属性时，如果这个对象内部不存在这个属性，那么他就会去__proto__里找这个属性，这个__proto__又会有自己的__proto__，于是就这样一直找下去，也就是我们平时所说的原型链概念。

而 prototype属性是只有函数才特有的属性，当你创建一个函数时， js会自动为这个函数加上 prototype属性，值是一个空对象。

5、React setState会触发哪些操作？

答：setState异步更新. setState方法通过一个队列机制实现state更新，当执行setState的时候，会将需要更新的state合并之后放入状态队列，而不会立即更新this.state(可以和浏览器的事件队列类比)。

三、应用题

1、随机生成一个长度为100的整数数组，并实现数组去重

答：记住主要的几种方法。hash数组、indexOf方法、ES6的Set集合实现去重等。

2、判断一个字符串是否是回文序列

答：从字符串的头部和尾部，逐次向中间检测；利用数组实现栈，先将字符串push入栈，再将栈内元素pop出栈，存储在另一个字符串中，最后比较字符串的正序和倒序是否相同。

四、编程题

1、手动实现一个deepclone（深拷贝）方法。