欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页

es6 Async / Await

程序员文章站 2023-12-21 21:43:22
...

async/awaitf这种特殊的语法可以更舒适地与promise协同工作。
async-await是promise和generator的语法糖。
async-await 是建立在 promise机制之上的,并不能取代其地位。

Async的使用:

使用方法:
    放置在函数的前面:async function demoFun () { return 1 }
    
含义:
    这个函数总是返回一个promise.
    promise中是没有return返回值的,只有resolve()成功回调与reject()失败回调
    如果代码中有return (也就是非promise语句),JavaScript会自动把返回的这个value值包装成promise的resolved值。
    如上示例中,返回为resolve为1的promise对象

两种写法:

    方法定义:
	async getData () {
	    return 1
	},
	async getDate () {
	    return Promise.resolve(2)
	}
		
    调用:
	this.getData().then(res => {
	    alert(res)
	})
    
	this.getDate().then(res => {
	    alert(res)
	})

Await
async确保了函数返回一个promise,即使其中包含非promise。
关键词await,只能在async函数里使用。

语法:
    let value = await promise

作用:
    关键词await可以让JS进行等待,直到一个promise执行并返回它的结果,JS才会继续往下执行。
    这并不会占用任何的cpu资源,因为引擎能够同时做其他工作:执行其他脚本,处理事件等等。
    一个await仅对应包裹他的一层async,await中不能包裹await,无论await修饰的是一个async方法或最外层方法被async修饰

两种写法:
    方法定义:
	async getPromiseResult () {
	    return await new Promise (function (resolve, reject) {
		resolve("done")
	    })
	},

	async getPromiseAnswer () {
	    let promise = new Promise(function (resolve, reject) {
		setTimeout(function () {
		    resolve('setTimeout dome !')
		}, 2000)
	    })

	    let result = await promise
		return result;
	}
	
    调用:
	this.getPromiseResult().then(res => {
	    alert(res)
	})

	this.getPromiseAnswer().then(res => {
	    alert(res)
	})

注意:
	不能在常规函数里使用await
	在非async函数里使用await,会报语法错误:syntax error
	
链式调用:
	async getChainResult () {
      let _this = this
      await _this.getData().then(res => {
         _this.getDate().then(ress => {
          alert(ress)
        })
        alert(res)
      })
      return 3
    }

与promise.then一样,await也允许使用thenable对象(那些具有可调用的then方法的对象)。
同样,第三方对象可能不是一个promise,但是promise的兼容性表示,如果它支持.then方法,那么它就能用于await。
即:await不仅只能在async中使用,而且描述的对象必须有可调用.then方法


一个class方法同样能够使用async,只需要将async放在它之前就可以
class Waiter {
   async wait () {
       return await Promise.resolve(1)
   }
}
new Waiter().wait().then(alert) // 1


错误处理:
    如果一个promise获取到了目标结果,则通过resolve进行返回结果,
    如果没有获取到目标结果,或者出现异常错误,则通过reject将非目标结果或是异常进行抛出。
    当然可以通过try..catch快速捕捉到异常,但如果是非目标结果,try...catch是捕捉不到了,
    但可以通过在.then()后缀.catch()去捕捉非目标结果,同时.catch()还能捕捉错误异常
    resolve 与 reject 在同一个promise中只能触发一个,且只能触发一次,优先触发resolve


当使用async/await,如无需返回值可以不使用.then,因为await总是等待着执行结果.
如果依赖返回值,还是需要使用依靠.then的返回对象获取返回值


for循环写法:
    // 正常 for 循环  await必须在async函数的上下文中的。
    async function forDemo() {
        let arr = [1, 2, 3, 4, 5];
        for (let i = 0; i < arr.length; i ++) {
            await arr[i];
        }
    }
    forDemo();//正常输出

上一篇:

下一篇: