js获取异步函数数据的实现.docx

第

js获取异步函数数据的实现

目录异步函数1.回调函数promiseGenerator函数async/await函数回调函数promiseasyncawait异步函数是js中经常会用到的，它的作用无非就是进行一些异步的操作（处理数据）。那么，常见的异步函数有哪些呢，我们一般又是如何获取异步函数的数据呢？今天这篇文章就是围绕这个问题去写的。

异步函数

一般正常情况下，js中的函数是一个一个地按照顺序来完成的。但是异步函数可以改变执行顺序。不过异步任务必须在同步任务执行结束之后，从任务队列中依次取出执行。

常见的异步函数一共有四类：

回调函数promise函数Generator函数async/await函数

1.回调函数

回调函数一般是作为某个函数的入参，然后在函数内部执行这个回调函数。常见的回调函数有ajax，setTimeouut定时器类，dom事件回调等。

testA(cb){

cb();

setTimeout(()={

console.log(这是一个回调函数)

},100)

缺点：不能trycatch捕获错误,不能直接return。

promise

promise函数是一种特殊的异步函数，里面包含三种状态：pending、fulfilled(resolved)、rejected。pending是promise的初始状态，resolved表示执行完成且成功的状态，rejected表示执行完成且失败的状态。三个状态不可逆转。

Promise本身是同步，then的内容是异步：

letpromiseFunc=newPromise((resolve,reject)={

//执行同步代码

resolve();

}).then((res)={

console.log(res)

},(err)={

console.log(err);

Generator函数

Generator是一个可以暂停执行（分段执行）的函数，函数名前面要加星号，是一个状态机，封装了多个内部状态。

function*myTest(){

yieldI,

yieldam,

yieldqueen

async/await函数

async修饰符加在函数前面，返回一个promise，可以使用then添加回调函数。await后跟着一个promise或者一个原始类型的值（会自动转成立即resolved的Promise对象），等待resolve的结果。任何一个await后的Promise发生reject，整个aysnc都会中断，需要try{}catch(err){}来捕获错误。

asyncfunctionmyTest(){

letval=awaitnewPromise((resolve)={

resolve(1)

如何获取异步函数的数据

获取异步函数的数据一般分为三种：回调函数，promise和async和await

回调函数

回调函数的这种很简单，就是直接将数据传进回调函数里作为入参即可。

functiongetData(cb){

letval=a;

cb(val);

getData((data)={

console.log(data);//a

promise

使用promise来处理异步，主要就是利用resolve成功的回调函数，reject失败的回调函数。

letpromiseFunc=newPromise((resolve,reject)={

letn=Math.random();

if(n=0.7){

resolve(n);

}else{

reject(`${n}小于0.7`)

promiseFunc.then((data)={

console.log(data);//0.3小于0.7

asyncawait

async:把函数变成异步函数。wait是等待异步函数执行完成。其中await一定要写在async里面

asyncfunctionmyTest(){

return我是测试数据

asyncfunctiongetData(){

letval=awaitmyTest();

console.log(val);//我是测试数据

}