关于前端的异步处理

传统的方案：

1. 回调函数

2. 事件

工具的方案：

1. Promise

1. 通过new Promise()
2. 参数是一个回调函数， 回调函数中有两个参数 （resolve reject）

• resolve也是一个函数， 函数中接收参数， 参数为任务
• resolve 中任务主线程 ， 而then中任务是放在异步队列中的，执行在主线程之后

3. Promise对象的api
   then(callback)
   catch(cb)

4. all race
   all([value1,value2])
   指的是将数组中所有的任务执行完成之后， 才执行.then 中的任务
   race表示赛跑， 谁快， 谁输出
   项目中使用：
   需求： 先获取数据，然后将获取的数据赋值给某一个变量
   const p3 = new Promise((resolve,reject)=>{
   request(‘http://api.douban.com/v2/movie/in_theaters’,(err,res,data)=>{
   resolve(data)
   })
   }).then((data)=>{
   // console.log( data )
   obj.data = data
   }).then(()=>console.log(obj.data))

   2. gengerator函数

es6 提供的 generator函数

1. 在function关键字后加一个* ， 那么这个函数就称之为generator函数

2. 函数体有关键字 yield ， 后面跟每一个任务 ， 也可以有return关键字， 保留一个数据

3. 通过next函数调用， 几个调用， 就是几个人任务执行

   3. async await

4. es7新增的 async函数

5. 格式
   async function aa(){
   await ‘任务1’
   await ‘任务2’
   }

6. 问题： readFile(’./01-Promise.js’) 运行结果是Promise, 但是我们使用 async await之后， 它的结果是具体的数据了？
   分析： async函数使用了generator函数的语法糖 ， 它直接生成对象 {value: ‘’,done:false} await 直接将value提取出来了
   实现： 将三层函数嵌套的第三层中的返回值返回来

7. 扩展：
   多层函数嵌套（异步执行） ， 我们想把里层函数，一般情况出现在数据请求，我们将请求得到的数据返回出来
   解决： Promise + async

   4. node.js nextTick setImmidate

nextTick vs setImmediate
轮询：
nodejs中是事件驱动的，有一个循环线程一直从事件队列中取任务执行或者
I/O的操作转给后台线程池来操作,把这个循环线程的每次执行的过程算是一次轮询.
2.setImmediate()的使用
即时计时器立即执行工作，它是在事件轮询之后执行,为了防止轮询阻塞,每次只会调用一个。
3.Process.nextTick()的使用
它和setImmediate()执行的顺序不一样，它是在事件轮询之前执行，为了防止I/O饥饿，所以有一个默认process.maxTickDepth=1000来限制事件队列的每次循环可执行的nextTick()事件的数目。
总结：

1. nextTick()的回调函数执行的优先级要高于setImmediate();
   2、 process.nextTick()属于idle观察者,setImmediate()属于check观察者.在每一轮循环检查中,idle观察者先于I/O观察者,I/O观察者先于check观察者.

2. 在具体实现上,process.nextTick()的回调函数保存在一个数组中,
   setImmediate()的结果则是保存在链表中.
   在行为上,process.nextTick()在每轮循环中会将数组中的回调函数全部执行完.
   而setImmediate()在每轮循环中执行链表中的一个回调函数.

   5. 第三方库 async.js

3. 第三方的封装库

4. 暴露了一个 async对象 ， 这个对象身上有很多的api

5. api (多任务执行)
   parallel
   series
   举例：
   async.parallel([
   function(callback){
   callback(null,‘任务1’)
   },
   function(callback){
   callback(null,‘任务2’)
   },
   ],(err,data)=>{
   console.log(‘data’,data)
   })
   除了npm之外的一个包管理器 yarn
   yarn add —> npm i / npm install
   yarn remove —> npm uninstall
   yarn add jquery global ----> npm i jquery -g
   yarn add jquery -----> npm i jquery -S || npm i jquery --save
   yarn add jquery -D -----> npm i jquery -D || npm i jquery --save-dev

对比 ： Promise vs gengerator vs async