有時候咱們須要等待兩個異步結果來執行接下來的操做,這個時候,若是使用async/await寫出近似於同步的流程,可能會有性能問題bash
咱們看一下這個例子的運行時間異步
function foo() {
return new Promise(function(resolve, reject) {
setTimeout(function() {
resolve(10)
}, 1000)
})
}
function bar() {
return new Promise(function(resolve, reject) {
setTimeout(function() {
resolve(20)
}, 1500)
})
}
async function test() {
let start = new Date().getTime()
let val1 = await foo()
let val2 = await bar()
let val = val1 + val2
let end = new Date().getTime()
let time = end - start
console.log(val)
console.log(time)
}
// 結果
// 30 val的結果
// 2505 test()運行時間
複製代碼
咱們換一種寫法,再來看看運行時間async
function foo() {
return new Promise(function(resolve, reject) {
setTimeout(function() {
resolve(10)
}, 1000)
})
}
function bar() {
return new Promise(function(resolve, reject) {
setTimeout(function() {
resolve(20)
}, 1500)
})
}
async function test() {
let start = new Date().getTime()
let p1 = foo()
let p2 = bar()
let val1 = await p1
let val2 = await p2
let val = val1 + val2
let end = new Date().getTime()
let time = end - start
console.log(val)
console.log(time)
}
// 結果
// 30 val的結果
// 1501 test()運行時間
複製代碼
換一種寫法,test()的運行時間少了一秒鐘是否是?函數
這是由於第一種寫法,必須等foo()運行結束才能運行bar(),因此所用的時間是兩個異步Promise等待時間的和;性能
而第二種寫法中,由於提早定義p1和p2,提早運行了這兩個Promise,程序運行到await p1的時候兩個Promsie都已經開始運行,也就是它們是並行的;優化
這樣test()的運行時間主要就取決於用時更長的那個Promise而不是二者的相加。ui
或者咱們也可使用Promise.all()來實現spa
function foo() {
return new Promise(function(resolve, reject) {
setTimeout(function() {
resolve(10)
}, 1000)
})
}
function bar() {
return new Promise(function(resolve, reject) {
setTimeout(function() {
resolve(20)
}, 1500)
})
}
async function test() {
let start = new Date().getTime()
let vals = await Promise.all([foo(), bar()])
let val = vals[0] + vals[1]
let end = new Date().getTime()
let time = end - start
console.log(val)
console.log(time)
}
// 結果
// 30 val的結果
// 1501 test()運行時間
複製代碼
這種寫法已經至關靠譜,可是,咱們仍是有優化的空間;code
async/await函數不該該關心異步Promise的具體實現細節,await應該只關心最終獲得的結果,這樣爲更加複雜的異步操做提供更加清晰的過程控制邏輯。get
function getVal() {
return Promise.all([foo, bar])
}
async function test() {
let vals = await getVal()
let val = vals[0] + vals[1]
console.log(val)
}
複製代碼
應該有意識的把這種邏輯從async/await中抽離出來,避免低層次的邏輯影響了高層次的邏輯;這也應該是全部的高度抽象化代碼中必要的一個環節,不一樣邏輯層次的代碼混雜在一塊兒最終會像回調地獄同樣讓本身和讀本身代碼的人陷入混亂。