es6 async 函数的理解和使用

分手后的思念是犯贱 2022-12-25 03:54 18阅读 0赞

async就是Generator 函数的语法糖

async函数对 Generator 函数的改进，体现在以下四点。  
1、内置执行器。  
async函数的执行，与普通函数一模一样，只需一行；而 Generator函数，需要调用next 方法

2、返回值是 Promise  
async函数的返回值是Promise，这比 Generator函数返回一个 Iterator对象方便多了

3、更好的语义化  
从字面意思上来讲，async是英文单词 asynchronous 的缩写，表示异步的；await中的 wait 是等待的意思。

4、更广的适用性。  
co模块约定，yield命令后面只能是 Thunk 函数或 Promise 对象，而async函数的await命令后面，可以是 Promise 对象和原始类型的值（数值、字符串和布尔值，但这时会自动转成立即 resolved 的 Promise 对象）

**基本用法**  
async 函数返回一个 Promise 实例对象，可以使用 then 方法添加回调函数。  
当函数执行时，一旦遇到 await 就会先返回，等到异步操作完成，再接着执行函数体内后面的语句。  
1、async 函数内部 return语句返回的值，会成为then方法回调函数的参数  
2、async 函数内部抛出错误，会导致返回的 Promise对象变成reject状态，抛出的错误会被catch方法回调函数接收到  
3、只有 async 函数内部的异步操作执行完，才会执行 then方法指定的回调函数  
使用中的写法

async function foo() { 
    
    }
    
    let foo = async function() { 
    
    }
    
    let foo = async() => { }
    
    let obj = { 
      name: 'jack',
      async foo() { 
    
      }
    }
    obj.foo().then(res => { 
    
    })
    
    // 类的方法
    class Student{ 
      constructor(name, age) { 
        this.name = name
      }
      async say() { 
        return `My name is ${ this.name}`
      }
    }
    let zoo = new Student('zoo')
    zoo.say().then(res => console.log(res))