前端面试题

1.什么是事件委托？为什么这样做？
答：它还有一个名字叫事件代理，事件委托就是利用事件冒泡，只指定一个事件处理程序，就可以管理某一类型的所有事件。
为什么这样做呢？通过事件委托可以减少事件处理程序数量，这样就能大大的减少与dom的交互次数，提高性能；
2.js数据类型？
答：JS的数据类型有8种。
在ES5的时候，我们认知的数据类型确实是 6种：Number、String、Boolean、undefined、object、Null。
ES6 中新增了一种 Symbol 。这种类型的对象永不相等，即始创建的时候传入相同的值，可以解决属性名冲突的问题，做为标记。
谷歌67版本中还出现了一种 bigInt。是指安全存储、操作大整数。（但是很多人不把这个做为一个类型）。
JS数据类型：Object 中包含了哪几种类型？其中包含了Date、function、Array等（这三种比较常用）。
3.for in、Object.keys()区别？哪个要用于遍历 原型链上的属性？
答：for-in 是javaScript中最常见的迭代语句，常常用来枚举对象的属性。某些情况下，可能按照随机顺序遍历数组元素；而Object.keys()，可以返回以对象的属性为元素的数组。数组中属性名的顺序跟使用，for-in遍历返回的顺序是一样的。
二者遍历的数量是不同的，for-in 不单可以枚举自身属性，也可以枚举继承自原型链上的属性，Object.keys()只可以枚举自身属性。
for-in会遍历原型链上的属性，而Object.keys不会。
4.NaN == NaN 的结果是什么？为什么?
答：NaN == NaN 的执行结果是 false。因为JavaScript规定，NaN表示的是非数字，但是这个非数字也是不同的，因此 NaN 不等于 NaN，两个NaN永远不可能相等。
5.说一下你对Promise的了解？说说你对Promise的原理的理解？
答：Promise 是异步编程的一种解决方案，比传统的解决方案——回调函数和事件——更合理和更强大。
所谓promise，简单说就是一个容器，里面保存着某个未来才会结束的事件（通常是一个异步操作）的结果。从语法上说，Promise 是一个对象，从它可以获取异步操作的消息。
6.Promise.all()，一个失败后，其他的还返回吗？
答：不会返回,promise.all()失败的时候只返回最先被reject失败状态的那个实例对象的值
7.Promise.all()、Promise.race()区别？‘
答：两者都是可以同时调用多个promise实现，Promise.all可以将多个实例组装成一个新的实例，成功的时候返回一个成功数组，失败的时候则返回最先被reject失败状态的值；其中有一个实例不成功则返回reject.race()是赛跑的意思，也就是说Promise.race([p1, p2, p3])里面的结果哪个获取的快，就返回哪个结果，不管结果本身是成功还是失败。
8.Promise有哪些状态。
答：有三个状态：pending : 等待 fullfilled(resolved) ：成功 reject: 失败
9.简单说一下async/await的了解？（****）（请参考https://www.jianshu.com/p/fd6933ff6b81）
答：async/await是写异步代码的新方式，它是generator的语法糖，以前的方法有回调函数和 Promise。async/await是基于Promise实现的，它不能用于普通的回调函数。async/await与Promise一样，是非阻塞的。async/await使得异步代码看起来像同步代码，这正是它的魔力所在。单一的 Promise 链并不能发现 async/await 的优势，但是，如果需要处理由多个 Promise 组成的 then 链的时候，优势就能体现出来了
10.Async&await和promise有什么区别？（参考https://www.jianshu.com/p/51f5fd21588e）
答：（1）函数前面多了一个async关键字。await关键字只能用在async定义的函数内。async函数会隐式返回一个promise
（2）简洁：使用async和await明显节约了不少代码，不需要.then,不需要写匿名函数处理promise的resolve的值，不需要定义多余的data变量，还避免了嵌套代码。
（3）async/await让try/catch 可以同时处理同步和异步错误。try/catch不能处理JSON.parse的错误，因为他在promise中。此时需要.catch，这样的错误处理代码非常冗余。并且，在我们的实际生产代码会更加复杂
（4）async/await能够使得代码调试更简单
11.get、post区别？
答： Get 方法通过 URL 请求来传递用户的数据，将表单内各字段名称与其内容，以成对的字符串连接，置于 action 属性所指程序的 url 后，数据都会直接显示在 url 上，就像用户点击一个链接一样；Post 方法通过 HTTP post 机制，将表单内各字段名称与其内容放置在 HTML 表头(header)内一起传送给服务器端交由 action 属性能所指的程序处理，该程序会通过标准输入(stdin)方式，将表单的数据读出并加以处理；
Get 方式需要使用 Request，QueryString 来取得变量的值；而 Post 方式通过RequestForm 来访问提交的内容；
Get 方式传输的数据量非常小，一般限制在 2 KB 左右，但是执行效率却比 Post 方法好；而 Post 方式传递的数据量相对较大，它是等待服务器来读取数据，不过也有字节限制，这是为了避免对服务器用大量数据进行恶意攻击。建议：除非你肯定你提交的数据可以一次性提交，否则请尽量用 Post 方法；
Get 方式提交数据，会带来安全问题，比如一个登陆页面，通过 Get 方式提交数据时，用户名和密码将出现在 URL 上，如果页面可以被缓存或者其他人可以访问客户这台机器，就可以从历史记录获得该用户的帐号和密码，所以表单提交建议使用 Post 方法；
get是从服务器上获取数据，post是向服务器传送数据。
get方式的安全性较Post方式要差些，包含机密信息的话，建议用Post数据提交方式；
在做数据查询时，建议用Get方式；而在做数据添加、修改或删除时，建议用Post方式。

12.有10个任务，使用promise如何同时运行5个任务
答：可以利用Promise.all()方法来同时支行5个任务
13.简单介绍原型链？
答：所有对象都有自己的原型对象（prototype）。一方面，任何一个对象，都可以充当其他对象的原型；另一方面，由于原型对象也是对象，所以它也有自己的原型。因此，就会形成一个“原型链”（prototype chain）最终都可以上溯到Object.prototype Object.prototype对象有没有它的原型呢？回答Object.prototype的原型是null。null没有任何属性和方法，也没有自己的原型。因此，原型链的尽头就是null。
14.const、let、var的区别？
答：var 声明的变量属于函数作用域，let 和 const 声明的变量属于块级作用域；
var 存在变量提升现象，而 let 和 const 没有此类现象；
var 变量可以重复声明，而在同一个块级作用域，let 变量不能重新声明，const 变量不能修改
Var 不存在暂时性死区，而let const存在暂时性死区
15.如果后端有3个请求，如何保证顺序
答：可以使用Promise链式调用，按顺序执行;也可以使用async函数和关键字await顺序执行

16.await后面可以是一个普通的函数吗？
答：可以，但是其结果会转化为promise的resolve状态
17.es6的set、map介绍？
答：set和map都是es6新增的数据结构。其中set是一个类数组结构，值是唯一的，没有重复的值。map类似于对象，也是键值对的集合，但是“键”的范围不限于字符串，各种类型的值（包括对象）都可以当作键。也就是说，Object 结构提供了“字符串—值”的对应，Map 结构提供了“值—值”的对应，是一种更完善的 Hash 结构实现。如果你需要“键值对”的数据结构，Map 比 Object 更合适。
18.数组去重除了set外，还可以怎么做？
答：
filter()和indexOf()实现去重

reduce()和includes()实现去重

双重for循环 + splice() 或 双重for循环 + push() (ES5的方法）

19.es6相关的知识知道哪些？
答：有很多，如Promise async函数 箭头函数 Symbol新的基本数据类型，class类等等
20.对箭头函数的了解，箭头函数的优缺点？
答：箭头函数是匿名函数，ES5匿名函数的语法糖，并且没有自己的this，arguments，super或 new.target。
它的优点是：
（1）简洁的语法、
（2）隐士返回，如 下面的代码可以去掉return,代码移到一行，减少代码量numbers.map((number)=>number*2)
（3）解决了this的指向问题，原生的写法this指向的是调用者，箭头函数this绑定的是定义时的那个对象。如果有对象嵌套的情况，则this绑定到最近的一层对象上
它的缺点是：
（1）做为构造函数的时候不能使用箭头函数
（2）真正需要this的时候如给元素绑定click事件的 时候，执行的回调函数不能使用箭头函数。
（3）我们需要使用arguments对象的时候不能使箭头函数。箭头函数中没有arguments对象。