JavaScript高级面试题（3）

部分笔记摘录

event-loop、Promise、Async/Await等

问题

什么是单线程，和异步有什么关系
什么是event-loop
是否用过jQuery的Deferred
Promise的基本使用和原理
介绍一下async/await（和Promise的区别、联系）
总结一下当前JS解决异步的方案。

1.单线程

单线程-介绍

什么是单线程，和异步的关系
1.单线程-只有一个线程，只能做一件事
2.原因-避免DOM渲染的冲突
3.解决方案-异步

单线程-只能关注一件事

//循环运行期间，JS执行和DOM渲染暂时卡顿
var i,sum = 0;
for(){

}
console.log(sum);   //上面不执行完，不会执行这段JS代码

//alert不处理（点击确认），JS执行和DOM渲染暂时卡顿
console.log(1)
alert('hello')
console.log(2)

单线程-异步

单线程原因-避免DOM渲染冲突

1.浏览器需要渲染DOM
2.JS可以修改DOM结构
3.JS只晓得时候，浏览器DOM渲染会暂停
4.两段JS也不能同时执行（都修改DOM就冲突了）
5.webworker支持多线程，但是不能访问DOM

解决方法-异步

异步一个例子：

console.log(100);
//反正1000ms之后执行，先不管它，先让其他JS代码运行
setTimeout(function(){
	console.log(200)
},1000);
console.log(300);
console.log(400);

//输出顺序
100
300
400
200

异步再看一个例子：

单线程-总结

问题解答：
单线程就是同时只做一件事，两段JS不能同时执行
原因就是为了避免DOM渲染的冲突
异步是一种“无奈”的解决方案，虽然有很多问题

问题：
1.问题一：没按照书写方式执行，可读性差
2.问题二：callback中不容易模块化

后面会针对这两个问题进行解决

2.event-loop

知识串联：
1.单线程-同时间只能做一件事
2.原因-避免DOM渲染冲突
3.解决方案-异步
4.异步代码执行实现方式-event-loop

event-loop：
1.事件轮询，JS实现异步的具体解决方案
2.同步代码，直接执行
3.异步函数先放在异步队列中
4.待同步函数执行完毕，轮询执行异步队列的函数

setTimeout(function(){
	console.log(1)
},100)
setTimeout(function(){
	console.log(2)
})
console.log(3)
3
2
1

我们要