会员登录 - 用户注册 - 设为首页 - 加入收藏 - 网站地图 ES6新增语法—Async...Await详解!

ES6新增语法—Async...Await详解

时间:2025-11-05 08:32:54 来源:益强数据堂 作者:人工智能 阅读:385次

 什么是新增详解async

async的意思是“异步”,顾名思义就是语法有关异步操作的关键字,async 是新增详解 ES7 才有的,与我们之前说的语法Promise、Generator有很大的新增详解关联。

使用语法:

async function name(param){ param //传递给函数的语法参数名称 statements //函数体 } name().then(function(res){ res//异步操作返回的结果 }) 

async 函数返回一个Promise对象,可以使用then方法添加回调函数。新增详解具体实例如下:

async function show(){  return {a:12,语法b:15} } console.log(show())//Promise {<fulfilled>: {…}} show().then(res=>{  console.log("res",res) }) 

什么是await

await关键字存在async函数表达式中,用于等待Promise对象,新增详解暂停执行,语法等到异步操作完成后,新增详解恢复async函数的语法执行并返回解析值。服务器托管如果把await放在asnyc函数体外,新增详解会报语法错误。语法

使用语法:

asnyc function name(){ returnValue = await expression; } 

expression 是新增详解一个Promise对象或一个需要等待的值,针对所跟不同表达式,有两种处理方式:

对于Promise对象,await会阻塞主函数执行,等待Promise对象执行resolve之后,resolve返回值作为await表达式运算结果,然后继续向下执行。

对于非Promise对象,可以是字符串、布尔值、数值以及普通函数等。await直接返回对应的值,而不是等待其执行结果。

await等待Promise对象实例如下:

async function test1(){  console.log("执行")  return new Promise((resolve,reject)=>{   setTimeout(()=>{    console.log("延迟3秒之后返回成功")    resolve({a:1})   },3000)  })   } async function test2(){  let x = await test1()  console.log("x",x)//{a: "1"}  return x } test2().then(function(res){   console.log("res",res)//{a: "1"} }) 

await 跟 普通函数 实例如下:

function test3(){  console.log("普通函数") } async function test4(){  await test3()  console.log("直接执行") } test4() 

捕获异常

上述的await后跟Promise对象,我们知道Promise有两种状态,resolved() 和 rejected() ,网站模板如果Promise对象变为rejected,会如何处理?

function testAwait(){  return Promise.reject("error"); } async function test1(){  await testAwait();  console.log("test1");//没有打印 } test1().then(v=>{  console.log(v); }).catch(e=>{  console.log(e);//"error" }) 

从上实例执行结果发现,返回的reject状态被外层的catch捕获,然后终止了后面的执行。但是在有些情况下,即使出错了我们还是继续执行,而不是中断,此时我们借助try...catch捕获内部异常。

function test1(){  return new Promise((resolve,reject)=>{  reject("error")  }) } async function test2(){  try{   await test1()  }catch(e){   console.log("报错",e)  } } test2().then((res)=>{  console.log("执行成功",res) // 打印:执行成功undefined }).catch(err=>{  console.log(err,err) }) 

Generator与async对比:

async利用await阻塞原理,代替了Generator的 yield 。 async 相比Generator 不需要 run 流程函数,完美地实现了异步流程。

从 Promise 到 Generator , 再到 async ,对于异步编程的解决方案越来越完美,这就是ES6不断发展的魅力所在。

免费信息发布网

(责任编辑:域名)

推荐内容
  • 解决galgame电脑运行错误的方法(探索电脑运行错误的原因与解决方案)
  • 驳“低代码开发取代程序员”论 为什么专业开发者也需要低代码?
  • 高效的10个Pandas函数,你都用过吗?
  • 广告系统架构解密
  • 如何应对台式电脑设置密码提示错误问题(解决密码提示错误的有效方法)
  • String 既然能这样性能调优,我直呼内行