一、Promise 的基本用法
Promise 是一種用于處理異步操作的對(duì)象,它代表了一個(gè)異步操作的最終完成或失敗。
創(chuàng)建 Promise
可以使用 new Promise() 來(lái)創(chuàng)建一個(gè) Promise 對(duì)象。這個(gè)構(gòu)造函數(shù)接受一個(gè)執(zhí)行器函數(shù),執(zhí)行器函數(shù)有兩個(gè)參數(shù):resolve 和 reject。
當(dāng)異步操作成功時(shí),調(diào)用 resolve 函數(shù)來(lái)傳遞結(jié)果;當(dāng)異步操作失敗時(shí),調(diào)用 reject 函數(shù)來(lái)傳遞錯(cuò)誤信息。
例如:
c*t myPromise = new Promise((resolve, reject) => { setTimeout(() => { c*t randomNumber = Math.random(); if (randomNumber > 0.5) { resolve(randomNumber); } else { reject(new Error('Random number is too *all')); } }, 1000); });
使用 Promise
Promise 對(duì)象有三個(gè)狀態(tài):pending
(等待中)、fulfilled
(已完成)和 rejected
(已拒絕)。
可以使用 .then()
*來(lái)處理 Promise 成功的情況,使用 .ca*h()
*來(lái)處理 Promise 失敗的情況。
例如:
myPromise.then(result => { c*ole.log(result); }).ca*h(error => { c*ole.error(error); });
二、使用 Promise 進(jìn)行異步數(shù)據(jù)處理 假設(shè)你有一個(gè)從服務(wù)器獲取用戶(hù)數(shù)據(jù)的函數(shù),使用 Promise 可以這樣寫(xiě):
function getUserData() { return new Promise((resolve, reject) => { // 模擬異步請(qǐng)求 setTimeout(() => { c*t data = { id: 1, name: 'John' }; resolve(data); }, 1000); }); }
然后可以這樣使用這個(gè)函數(shù):
getUserData().then(user => { c*ole.log(user); }).ca*h(error => { c*ole.error(error); });
三、async/await 的基本用法
async/await 是基于 Promise 的語(yǔ)法糖,它使得異步代碼看起來(lái)更像同步代碼,更加易讀和易于維護(hù)。
定義 async 函數(shù)
使用 async 關(guān)鍵字來(lái)定義一個(gè)異步函數(shù)。異步函數(shù)會(huì)自動(dòng)返回一個(gè) Promise 對(duì)象。
例如:
async function myAsyncFunction() {
return 'Hello';
}
使用 await 在異步函數(shù)中,可以使用 await 關(guān)鍵字來(lái)等待一個(gè) Promise 對(duì)象的結(jié)果。await 只能在 async 函數(shù)內(nèi)部使用。 例如:
async function myAsyncFunction() { c*t result = await Promise.resolve('Hello'); return result; } 四、使用 async/await 進(jìn)行異步數(shù)據(jù)處理 結(jié)合上面的 getUserData 函數(shù),可以使用 async/await 這樣寫(xiě):
async function displayUserData() { try { c*t user = await getUserData(); c*ole.log(user); } ca*h (error) { c*ole.error(error); } }
五、逐步替換回調(diào)函數(shù) 識(shí)別回調(diào)函數(shù)的使用場(chǎng)景 在你的項(xiàng)目中,找到那些使用回調(diào)函數(shù)進(jìn)行異步數(shù)據(jù)處理的地方。通常,這些地方可能是從服務(wù)器獲取數(shù)據(jù)、進(jìn)行文件讀取或?qū)懭氲炔僮鳌? 將回調(diào)函數(shù)轉(zhuǎn)換為 Promise 對(duì)于那些使用回調(diào)函數(shù)的異步操作,嘗試將它們轉(zhuǎn)換為 Promise。這可能需要一些重構(gòu),但可以使代碼更加統(tǒng)一和易于管理。 例如,如果有一個(gè)函數(shù) fe*hData(callback) 使用回調(diào)函數(shù)來(lái)獲取數(shù)據(jù),可以將其轉(zhuǎn)換為 fe*hData*romise() 返回一個(gè) Promise 對(duì)象。
function fe*hData*romise() { return new Promise((resolve, reject) => { fe*hData(data => { if (data) { resolve(data); } else { reject(new Error('Failed to fe*h data')); } }); }); }
使用 async/await 來(lái)調(diào)用 Promise
在需要使用異步數(shù)據(jù)的地方,使用 async/await 來(lái)調(diào)用 Promise。這將使異步代碼看起來(lái)更加同步,提高代碼的可讀性。
async function processData() {
try {
c*t data = await fe*hData*romise();
// 處理數(shù)據(jù)
} ca*h (error) {
c*ole.error(error);
}
}