生活随笔
收集整理的這篇文章主要介紹了
异步编程的实现方式
小編覺得挺不錯的,現在分享給大家,幫大家做個參考.
一、回調函數
優點：簡單、容易理解；
缺點：不利于維護，代碼耦合高；
function getData (url, callBack) {// 模擬發送網絡請求setTimeout(() =>
{// 假設 res 就是返回的數據var res =
{url: url,data: Math.random()}// 執行回調，將數據作為參數傳遞
callBack(res);}, 1000
)
}getData('/page/1?param=123', (res1) =>
{console.log(res1);getData(`/page/2?param=${res1.data}`, (res2) =>
{console.log(res2);getData(`/page/3?param=${res2.data}`, (res3) =>
{console.log(res3);})})
})
二、事件監聽
優點：容易理解，可以綁定多個事件，每個事件可以指定多個回調函數。
缺點：采用事件驅動模式，取決于某個事件是否發生，流程不夠清晰。
三、發布/訂閱(觀察者模式)
類似于事件監聽，但是可以通過"消息中心"了解現在有多少發布者，多少訂閱者。
四、promise對象
優點：可以利用then方法，進行鏈式寫法；可以書寫發生錯誤的回調函數；
缺點：一旦新建Promise，會立即執行，中途無法取消。如果沒有設置回調函數，Promise內部拋出錯誤，外部無法知道。如果是pending進行中狀態，不知道剛剛開始還是即將完成。
function getDataAsync (url) {return new Promise((resolve, reject) =>
{setTimeout(() =>
{var res =
{url: url,data: Math.random()}resolve(res);}, 1000
)})
}getDataAsync('/page/1?param=123'
).then(res1 =>
{console.log(res1);return getDataAsync(`/page/2?param=
${res1.data}`);}).then(res2 =>
{console.log(res2);return getDataAsync(`/page/3?param=
${res2.data}`);}).then(res3 =>
{console.log(res3);})
五、generator函數
優點：函數體內外的數據交換、錯誤處理機制。
缺點：流程管理不方便，何時執行第一階段，何時執行第二階段。generator函數不能自動執行，Thunk函數或者co模塊用于實現generator函數的自動執行。
function getDataAsync (url) {return new Promise((resolve, reject) =>
{setTimeout(() =>
{var res =
{url: url,data: Math.random()}resolve(res);}, 1000
)})
}function *
getData () {var res1 = yield getDataAsync('/page/1?param=123'
);console.log(res1);var res2 = yield getDataAsync(`/page/2?param=
${res1.data}`);console.log(res2);var res3 = yield getDataAsync(`/page/2?param=
${res2.data}`);console.log(res3));
}var g =
getData();
g.next().value.then(res1 =>
{g.next(res1).value.then(res2 =>
{g.next(res2).value.then(() =>
{g.next();})})
}) // 封裝一個執行器
function run (gen) {var g =
gen();function next (data) {var res =
g.next(data);if (res.done)
return res.value;res.value.then((data) =>
{next(data);})}next();
}run(getData);
六、async函數
優點：內置執行器、更好的語義、更廣的適用性、返回的是promise、結構清晰。
缺點：錯誤處理機制
function getDataAsync (url) {return new Promise((resolve, reject) =>
{setTimeout(() =>
{var res =
{url: url,data: Math.random()}resolve(res)}, 1000
)})
}async function getData () {var res1 = await getDataAsync('/page/1?param=123'
)console.log(res1)var res2 = await getDataAsync(`/page/2?param=
${res1.data}`)console.log(res2)var res3 = await getDataAsync(`/page/2?param=
${res2.data}`)console.log(res3)
}
轉載于:https://www.cnblogs.com/camille666/p/async_programming.html
總結
以上是生活随笔為你收集整理的异步编程的实现方式的全部內容，希望文章能夠幫你解決所遇到的問題。
如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。
