异步解决方法

异步

异步

特点：1异步代码，在同步代码之后执行

​ 2.异步代码，存放在任务就开始执行

同一时间，执行多个任务代码

回调 （callback）地狱

setTimeout(function(){
    console.log(1);
    setTimeout(function(){
        console.log(2);
        setTimeout(function(){
            console.log(3);
            setTimeout(function(){
                console.log(4);
            },1000);
        },1000);
    },1000);
},1000);

【promise 解决异步的一种方式，其本身不是异步】

先new Promise；拿到一个实例化对象,实参是一个回调函数

new Promise(()=>{});

回调函数中的参数，又是两个回调

用then方法，参数是上一次Promise的返回值（链式调用，返回的必须是一个Promise实例化对象）

回调函数式使用resolve（成功）和reject（失败），先调用哪个就一定不会执行另一个（即成功和失败谁写在前面，谁就先调用）

resolve是成功，可以返回一个promise，继续回调

reject是失败，只要有一次then的返回值失败则直接执行reject的函数

//【promise 解决异步的一种方式】
new Promise((resolve, reject) => {
//回调函数中的参数，又是两个回调
    resolve(1);
    reject(2);
    //用then方法，参数是上一次Promise的返回值（可以是回调）
}).then((data) => {
    console.log("成功" + data);
    return new Promise((resolve, reject) => {
        resolve(3);
        // reject(4);
    })
}).then((data) => {
    console.log("成功" + data);
    return new Promise((resolve, reject) => {
        reject(6);
       
        resolve(5);
    })
}).catch(() => { console.log('失败!!!'); });

异步迭代的四个阶段：

第一阶段：

回调 （callback）函数 回调地狱

缺点：嵌套的方式，不方便阅读代码，不利于维护代码

第二阶段：

 Promise
 * 1、promise就是一个容器，存放的是未来要执行的代码
 * 2、promise就是一个构造函数，接受一个callback
 * 3、callback接受2个参数(resolve,reject)，并且都是callback
 *    注：参1调用表示"成功"，参2被调用表示"失败"
 * 
 * Promise的实例化对象，就有一个PromiseState的状态（3种）
 * 默认是pending（就绪）
 * 调用resolve,PromiseState则为fulfilled，即成功
 * 调用reject,PromiseState则为rejected，即失败
 * 注:  2选1   
 *    A结果：pending变为fulfilled
 *    B结果：pending变为rejected
 * 即先调用resolve，再调用reject，状态依然为fulfilled
 * 
 * Promise的实例化对象，
 * 有一个PromiseResult的内容是callback(resolve,reject)的实参
 */

Promise

缺点：很多多余的代码，

第三阶段：

1，在function后面推荐*

2，在函数体添加关键字yield

3，函数返回一个对象（iterator）有2组键值对

键名 键值

value yield后的值

done 如果是函数体 异步函数执行完为 teue 反之false

注 如果yield后是赋值，接受next的实参

generator 异步函数

缺点：需要辅助函数 co 协程

第四阶段：

async/await

async function fun0() {
    console.log(1)
    return 1
}
fun0().then( x => { console.log(x) })  //  输出结果 1， 1，
async function funa() {
    console.log('a')
    return 'a'
}
funa().then( x => { console.log(x) })  //  输出结果a， a，


async function funo() {
    console.log({})
    return {}
}

funo().then( x => { console.log(x) })   // 输出结果 {}  {}

async function funp() {
    console.log('Promise')
    return new Promise(function(resolve, reject){
        resolve('Promise')
    })
}

funp().then( x => { console.log(x) })   // 输出promise  promise

async和await必须配合使用，能解决以前的异步问题，async要写在最外部的函数身上。

await和promise配合使用，await会等待它后面的执行完毕才会结束。比如，ajax写在了promise里面，promise跟在await后面，如果ajax没有执行完（例如服务器返回数据还在路上，还没有执行完success函数），会等待执行完毕，不会继续往下执行。所以能解决异步问题