uni-app 項目記錄

await
等候，等待；期待

什麼是async、await
await 用於等待異步完成
通常async、await都是跟隨Promise一起使用的

async返回的都是一個Promise對象同時async適用於任何類型的函數上。這樣await得到的就是一個Promise對象

async function testSync() {
    const response = await new Promise(resolve => {
        setTimeout(() => {
            resolve("async await test...");
         }, 1000);
    });
    console.log(response);
}
testSync();//async await test...

async function asyncAwaitFn(str) {
   return await new Promise((resolve, reject) => {
       setTimeout(() => {
           resolve(str)
       }, 1000);
   })
}

const serialFn = async () => { //串行執行

   console.time('serialFn')
   console.log(await asyncAwaitFn('string 1'));
   console.log(await asyncAwaitFn('string 2'));
   console.timeEnd('serialFn')
}

serialFn();

async function asyncAwaitFn(str) {
   return await new Promise((resolve, reject) => {
       setTimeout(() => {
           resolve(str)
       }, 1000);
   })
}
const parallel = async () => { //並行執行
   console.time('parallel')
   const parallelOne = asyncAwaitFn('string 1');
   const parallelTwo = asyncAwaitFn('string 2')

   //直接打印
   console.log(await parallelOne)
   console.log(await parallelTwo)

   console.timeEnd('parallel')


}
parallel()

await 操作符用於等待一個Promise 對象。它只能在異步函數 async function 中使用。
表達式
一個 Promise 對象或者任何要等待的值。
返回值
返回 Promise 對象的處理結果。如果等待的不是 Promise 對象，則返回該值本身。

await 表達式會暫停當前 async function 的執行，等待 Promise 處理完成。若 Promise 正常處理(fulfilled)，其回調的resolve函數參數作爲 await 表達式的值，繼續執行 async function。

若 Promise 處理異常(rejected)，await 表達式會把 Promise 的異常原因拋出。

另外，如果 await 操作符後的表達式的值不是一個 Promise，則返回該值本身。

function resolveAfter2Seconds(x) {
 return new Promise(resolve => {
   setTimeout(() => {
     resolve(x);
   }, 2000);
 });
}

async function f1() {
 var x = await resolveAfter2Seconds(10);
 console.log(x); // 10
}
f1();

async function f2() {
 var y = await 20;
 console.log(y); // 20
}
f2();

async function f3() {
 try {
   var z = await Promise.reject(30);
 } catch (e) {
   console.log(e); // 30
 }
}
f3();

setTimeout，Promise，async/await的區別？

async/await

async/ await來發送異步請求，從服務端獲取數據

async的用法
它作爲一個關鍵字放到函數前面，用於表示函數是一個異步函數

async function timeout() {
　　return 'hello world';
}

async function timeout() {
   return 'hello world'
}
timeout();
console.log('雖然在後面，但是我先執行');

async function timeout() {
   return 'hello world'
}
timeout().then(result => {
   console.log(result);
})
console.log('雖然在後面，但是我先執行');

控制檯中的Promise 有一個resolved，這是async 函數內部的實現原理。

返回一個值
當調用該函數時，內部會調用Promise.solve() 方法把它轉化成一個promise 對象作爲返回

函數內部拋出錯誤
就會調用Promise.reject() 返回一個promise 對象

async function timeout(flag) {
   if (flag) {
       return 'hello world'
   } else {
       throw 'my god, failure'
   }
}
console.log(timeout(true))  // 調用Promise.resolve() 返回promise 對象。
console.log(timeout(false)); // 調用Promise.reject() 返回promise 對象。

如果函數內部拋出錯誤， promise 對象有一個catch 方法進行捕獲。

timeout(false).catch(err => {
   console.log(err)
})

await是等待的意思
它後面跟着什麼呢？

注意await 關鍵字只能放到async 函數裏面

更多的是放一個返回promise 對象的表達式

// 2s 之後返回雙倍的值
function doubleAfter2seconds(num) {
   return new Promise((resolve, reject) => {
       setTimeout(() => {
           resolve(2 * num)
       }, 2000);
   } )
}

async function testResult() {
   let result = await doubleAfter2seconds(30);
   console.log(result);
}

const express = require('express');
const app = express();// express.static 提供靜態文件，就是html, css, js 文件
app.use(express.static('public'));

app.listen(3000, () => {
   console.log('server start');
})

---

若本號內容有做得不到位的地方（比如：涉及版權或其他問題），請及時聯繫我們進行整改即可，會在第一時間進行處理。

---

請點贊！因爲你們的贊同/鼓勵是我寫作的最大動力！

歡迎關注達達的簡書！

這是一個有質量，有態度的博客