谈谈 Javascript 的运行机制及对同步异步的理解

须要理解同步与异步咱们必须从单线程提及
复制代码

什么是单线程？单线程有什么好处？单线程带来了什么问题？

js 自己是单线程的，单线程指的是同一时间段只能作同一件事情，也就是说两段 js 代码不能同时运行。

js 是单线程的缘由是为了不 dom 渲染时被污染

单线程会致使阻塞的问题，好比咱们一般把 script 标签放在 body 标签以后，这也是为了解决单线程阻塞带来的页面短期空白的问题。

单线程就意味着，全部任务须要排队，前一个任务结束，才会执行后一个任务。若是前一个任务耗时很长，后一个任务就不得不一直等着。因而就有一个概念，任务队列。若是排队是由于计算量大，CPU忙不过来，倒也算了，可是不少时候CPU是闲着的，由于IO设备（输入输出设备）很慢（好比Ajax操做从网络读取数据），不得不等着结果出来，再往下执行。JavaScript语言的设计者意识到，这时主线程彻底能够无论IO设备，挂起处于等待中的任务，先运行排在后面的任务。等到IO设备返回告终果，再回过头，把挂起的任务继续执行下去。因而，全部任务能够分红两种，一种是同步任务（synchronous），另外一种是异步任务（asynchronous）。

---

同步

同步指的是代码从上往下执行，只有上一个任务执行完以后才会执行下一个任务，在主线程中运行，而且造成一个执行栈。

同步代码：
```
    console.log(1)
    console.log(2)
    console.log(3)
    
    上面的代码会依次输出 1 2 3
```
复制代码

---

异步

异步指的是代码不进入主线程的，而是进入一个任务队列，只有在主线程中的代码执行完以后才会执行。

异步所在的问题，会致使回调地狱的出现，不利于代码的封装，可读性差。

异步代码：
```
    console.log(1)
    setTimeout(function() {
        console.log(2)
    }, 0)
    console.log(3)
    
    上面的代码会输出 1 3 2
    获得这样的结果是由于 setTimeout 函数是异步的因此会将回调函数放入异步队列中，等待主线程中的任务执行完以后，在执行回调函数即便延迟时间为0。
```
复制代码

---

js 的运行机制也就是异步的实现原理

异步的实现原理主要是经过事件轮询也就是Event Loop来实现的具体步骤以下：

1. 同步代码在主线程中从上往下开始执行，造成一个执行栈
2. 异步代码发在异步队列中
3. 当主线程中的代码执行完以后，经过轮询的方式来执行任务队列中的代码
4. 主线程不断重复上第三个步骤
复制代码