JS异步之旅

193 阅读2分钟

文章内容输出来源:拉勾大前端高薪训练营

JS采用单线程模式工作

JS运行环境支持两种模式的api,即同步模式和异步模式。同步模式api如console.log 。异步模式如setTimeout。

事件循环eventloop

  JS运行环境中的事件循环本质上是无限循环函数。
  用于监听JS调用堆栈是否存在未处理任务,
  若不存在,就会从消息队列中取出消息(即回调函数)压入JS调用堆栈执行

消息队列

  消息队列中的消息本质上就是回调函数。所以消息队列也可以称作回调队列。

宏任务

  JS运行环境中的消息队列存放的所有消息(即回调函数)都属于宏任务。

微任务

  微任务是在当前宏任务执行完后会立即执行的api。
  这些api包括Promise.then/process.nextTick/MutationObserver。

Promise

   一种ES6语法规范,代表一种现实世界中的承诺。
   包含三种状态即挂起,兑现,失败。
   用于解决回调嵌套导致的回调地狱问题。
   Promise本质上就是ES6中的类。
   存在4种实例方法即resolve,reject,then,catch。
   存在2种静态方法即all,race。
   Promise.then方法支持链式调用。

Generator

  虽然Promise.then的链式调用成功解决了回调地狱问题,
  但是可读性依然不太符合代码阅读习惯,这就是生成器出现的原因。
  可以通过function * 定义生成器函数。
  生成器函数有些特殊即调用生成器函数时,生成器函数体并不立即执行。
  此时只是返回生成器对象,该对象包含next函数,调用next函数,生成器函数才开始执行,
  并且执行到yield后暂停执行。
  可以在生成器函数体中放置多个yield。
  外部再次调用生成器对象的next函数时会将其参数传入生成器函数体中原暂停执行的yield处左边的变量(可选的)
  然后继续执行直到遇到下一个yield处。

Await/Async

  ES7中的语法糖果,用于更直观书写异步代码。
  并且保证代码执行顺序就是代码书写顺序。
  通过async function定义。在函数体中通过await关键字调用异步代码。