es6 异步函数

不念不忘少年蓝@ 2022-06-09 14:46 217阅读 0赞

# async函数      #

Async/Await应该是目前最简单的异步方案了,ES7 中新增了 async/await 两个关键词。async 可以声明一个异步函数，此函数需要返回一个 Promise 对象。await 可以等待一个 Promise 对象 resolve，并拿到结果。  
一个栗子：  
var sleep = function (time) \{  
    return new Promise(function (resolve, reject) \{  
    console.log('执行');  
        setTimeout(function () \{  
            resolve();  
        \}, time);  
    \})  
\};  
  
var start = async function () \{  
    // 在这里使用起来就像同步代码那样直观  
    console.log('start');  
    await sleep(3000);  
    console.log('end');  
\};  
  
start();  
  
async 表示这是一个async函数，await只能用在这个函数里面。  
  
await 表示在这里等待promise返回结果了，再继续执行。  
  
await 后面跟着的应该是一个promise对象（当然，其他返回值也没关系，只是会立即执行，不过那样就没有意义了）  
  
获得返回值  
  
await等待的虽然是promise对象，但不必写.then(..)，直接可以得到返回值。  
  
var sleep = function (time) \{  
    return new Promise(function (resolve, reject) \{  
        setTimeout(function () \{  
            // 返回 ‘ok’  
            resolve('ok');  
        \}, time);  
    \})  
\};  
  
var start = async function () \{  
    let result = await sleep(3000);  
    console.log(result); // 收到 ‘ok’  
\};  
  
捕捉错误  
  
既然.then(..)不用写了，那么.catch(..)也不用写，可以直接用标准的try catch语法捕捉错误。  
  
var sleep = function (time) \{  
    return new Promise(function (resolve, reject) \{  
        setTimeout(function () \{  
            // 模拟出错了，返回 ‘error’  
            reject('error');  
        \}, time);  
    \})  
\};  
  
var start = async function () \{  
    try \{  
        console.log('start');  
        await sleep(3000); // 这里得到了一个返回错误  
          
        // 所以以下代码不会被执行了  
        console.log('end');  
    \} catch (err) \{  
        console.log(err); // 这里捕捉到错误 \`error\`  
    \}  
\};  
  
循环多个await  
  
await看起来就像是同步代码，所以可以理所当然的写在for循环里，不必担心以往需要闭包才能解决的问题。  
  
..省略以上代码  
  
var start = async function () \{  
    for (var i = 1; i <= 10; i++) \{  
        console.log(\`当前是第$\{i\}次等待..\`);  
        await sleep(1000);  
    \}  
\};  
值得注意的是，await必须在async函数的上下文中的。  
  
..省略以上代码  
  
let 一到十 = \[1,2,3,4,5,6,7,8,9,10\];  
  
// 错误示范  
一到十.forEach(function (v) \{  
    console.log(\`当前是第$\{v\}次等待..\`);  
    await sleep(1000); // 错误!! await只能在async函数中运行  
\});  
  
// 正确示范  
for(var v of 一到十) \{  
    console.log(\`当前是第$\{v\}次等待..\`);  
    await sleep(1000); // 正确, for循环的上下文还在async函数中