目錄

• 異步函數(shù)
• 1. 回調(diào)函數(shù)
• promise
• Generator函數(shù)
• async/await函數(shù)
• 回調(diào)函數(shù)
• promise
• async await

異步函數(shù)是js中經(jīng)常會用到的，它的作用無非就是進(jìn)行一些異步的操作（處理數(shù)據(jù)）。那么，常見的異步函數(shù)有哪些呢，我們一般又是如何獲取異步函數(shù)的數(shù)據(jù)呢？今天這篇文章就是圍繞這個問題去寫的。

異步函數(shù)

一般正常情況下，js中的函數(shù)是一個一個地按照順序來完成的。但是異步函數(shù)可以改變執(zhí)行順序。不過異步任務(wù)必須在同步任務(wù)執(zhí)行結(jié)束之后，從任務(wù)隊列中依次取出執(zhí)行。

常見的異步函數(shù)一共有四類：

• 回調(diào)函數(shù)
• promise函數(shù)
• Generator函數(shù)
• async/await函數(shù)

1. 回調(diào)函數(shù)

回調(diào)函數(shù)一般是作為某個函數(shù)的入?yún)ⅲ缓笤诤瘮?shù)內(nèi)部執(zhí)行這個回調(diào)函數(shù)。常見的回調(diào)函數(shù)有ajax，setTimeouut定時器類，dom事件回調(diào)等。

testA(cb) {
cb();
}
setTimeout(() => {
console.log("這是一個回調(diào)函數(shù)")
}, 100)

缺點(diǎn)： 不能try catch捕獲錯誤, 不能直接return。

promise

promise函數(shù)是一種特殊的異步函數(shù)，里面包含三種狀態(tài)：pending、fulfilled(resolved)、rejected。pending是promise的初始狀態(tài)，resolved表示執(zhí)行完成且成功的狀態(tài)，rejected表示執(zhí)行完成且失敗的狀態(tài)。三個狀態(tài)不可逆轉(zhuǎn)。

Promise本身是同步，then的內(nèi)容是異步：

let promiseFunc = new Promise((resolve, reject) => {
  // 執(zhí)行同步代碼
  resolve();
}).then((res) => {
  console.log(res)
},(err) => {
  console.log(err);
})

Generator函數(shù)

Generator 是一個可以暫停執(zhí)行（分段執(zhí)行）的函數(shù)，函數(shù)名前面要加星號，是一個狀態(tài)機(jī)，封裝了多個內(nèi)部狀態(tài)。

function *myTest() {
  yield "I",
  yield "am",
  yield "queen"
}

async/await函數(shù)

async修飾符加在函數(shù)前面，返回一個promise，可以使用then添加回調(diào)函數(shù)。 await后跟著一個promise或者一個原始類型的值（會自動轉(zhuǎn)成立即 resolved 的 Promise 對象），等待resolve的結(jié)果。任何一個await后的Promise發(fā)生reject，整個aysnc都會中斷，需要try{}catch(err){}來捕獲錯誤。

async function myTest() {
  let val = await new Promise((resolve) => {
    resolve(1)
  });
}

如何獲取異步函數(shù)的數(shù)據(jù)

獲取異步函數(shù)的數(shù)據(jù)一般分為三種：回調(diào)函數(shù)，promise和async和await

回調(diào)函數(shù)

回調(diào)函數(shù)的這種很簡單，就是直接將數(shù)據(jù)傳進(jìn)回調(diào)函數(shù)里作為入?yún)⒓纯伞?/p>

function getData(cb) {
  let val = "a";
  cb(val);
}

getData((data) => {
  console.log(data);   // "a"
})

promise

使用promise來處理異步，主要就是利用resolve成功的回調(diào)函數(shù)，reject失敗的回調(diào)函數(shù)。

let promiseFunc = new Promise((resolve, reject) => {
  let n = Math.random();
  if (n >= 0.7) {
    resolve(n);
  } else {
    reject(`${n}小于0.7`)
  }
});
promiseFunc.then((data) => {
  console.log(data);   // 0.3小于0.7
})

async await

async: 把函數(shù)變成異步函數(shù)。wait是等待異步函數(shù)執(zhí)行完成。其中await一定要寫在async里面

async function myTest() {
  return "我是測試數(shù)據(jù)"
};
async function getData() {
  let val = await myTest();
  console.log(val);   // 我是測試數(shù)據(jù)
}

到此這篇關(guān)于js獲取異步函數(shù)數(shù)據(jù)的實(shí)現(xiàn)的文章就介紹到這了,更多相關(guān)js獲取異步函數(shù) 內(nèi)容請搜索以前的文章或繼續(xù)瀏覽下面的相關(guān)文章希望大家以后多多支持！