js中同步异步，任务队列

单线程

• 浏览器是多线程运行的，它给js分配一个线程；js就是单线程运行的【一次只干一件事】

所谓单线程，就是只一次只能完成一件任务。如果有多个任务，就必须排队，前面一个任务完成，在执行后面一个任务，以次类推。

js执行分为同步和异步，其中异步来自于浏览器提供的异步队列，在浏览器中分为两个任务队列，一个是主任务队列【同步编程】，一个是等待任务队列【异步编程】

了解js的异步我们应该先了解下js的运行环境=>浏览器

一个浏览器通常由一下几个常住的线程

• 渲染引擎线程：顾名思义，该线程负责页面的渲染
• js引擎线程：负责js解析和执行
• 定时触发器线程：处理定时事件，比如setTimeout,setInterval
• 事件触发线程：处理DOM事件
• 异步http请求线程：处理http请求

注意：渲染线程和js引擎线程是不能同时进行的。渲染线程在执行任务的时候，js引擎线程会被挂起。因为js可以操作DOM,若在渲染中js处理了DOM，浏览器可能就不知所措了

虽然JavaScript是单线程的，可是浏览器内部不是单线程的。一些I/O操作、定时器的计时和事件监听（click, keydown...）等都是由浏览器提供的其他线程来完成的。

Javascript语言将任务的执行模式分成两种：同步（Synchronous）和异步（Asynchronous）。

"同步模式"就是上一段的模式，后一个任务等待前一个任务结束，然后再执行，程序的执行顺序与任务的排列顺序是一致的、同步的；"异步模式"则完全不同，每一个任务有一个或多个回调函数（callback），前一个任务结束后，不是执行后一个任务，而是执行回调函数，后一个任务则是不等前一个任务结束就执行，所以程序的执行顺序与任务的排列顺序是不一致的、异步的。

"异步模式"非常重要。在浏览器端，耗时很长的操作都应该异步执行，避免浏览器失去响应，最好的例子就是Ajax操作。在服务器端，"异步模式"甚至是唯一的模式，因为执行环境是单线程的，如果允许同步执行所有http请求，服务器性能会急剧下降，很快就会失去响应。

同步

    console.log(1)
    function fn(){
        console.log(2)
    }
    fn()
    console.log(3)

上面代码输入1 2 3 ,因为js是单线程的，代码由上而下依次执行

异步

js中

• AJax请求
• 定时器
• 事件
• 回调函数

上面这4中都是属于异步的

    console.log(1)
    setTimeout(()=>{
        console.log(2)
    })
    console.log(3)

上面代码执行会输出，1 3 2 ，因为setTimeout是异步的，js会将setTimeout放到异步队列，等待同步队列全部执行完毕，在执行异步队列

任务队列

js中有两类任务队列：宏任务队列和微任务队列。宏任务队列可以有多个，微任务队列只有一个

• 宏任务：script(全局任务)，setTimeout,setInterval
• 微任务：process.nextTick, Promise, Object.observer

setTimeout(_ => console.log(4))

new Promise(resolve => {
  resolve()
  console.log(1)
}).then(_ => {
  console.log(3)
})

console.log(2)

上面代码中，setTimeout就是作为宏任务来存在的，而Promise.then则是具有代表性的微任务

所有会进入的异步都是指的事件回调中的那部分代码

也就是说new Promise在实例化的过程中所执行的代码都是同步进行的，而then中注册的回调才是异步执行的。
在同步代码执行完成后才回去检查是否有异步任务完成，并执行对应的回调，而微任务又会在宏任务之前执行。所以就得到了上面的输出1 2 3 4