走进ES6的世界:基础语法入门指南4

简介: 走进ES6的世界:基础语法入门指南

10、async 函数

10.1、基本用法

用于声明异步函数,返回值为一个 Promise 对象,它以类似 同步 的方式来写异步方法。可以使用then方法添加回调函数。当函数执行的时候,一旦遇到await就会先返回,等到异步操作完成,再接着执行函数体内后面的语句。(async表示函数里有异步操作,await表示紧跟在后面的表达式需要等待结果。)

下面是一个例子。

async function getStockPriceByName(name) {
  const symbol = await getStockSymbol(name);
  const stockPrice = await getStockPrice(symbol);
  return stockPrice;
}
getStockPriceByName('goog').then(function (result) {
  console.log(result);
});

async 函数有多种使用形式。

// 函数声明
async function foo() {}
// 函数表达式
const foo = async function () {};
// 对象的方法
let obj = { async foo() {} };
obj.foo().then(...)
// 箭头函数
const foo = async () => {};

10.2、返回 Promise 对象

async函数返回一个 Promise 对象。

async函数内部return语句返回的值,会成为then方法回调函数的参数。

async function f() {
  return 'hello world';
}
f().then(v => console.log(v))
// "hello world"

上面代码中,函数f内部return命令返回的值,会被then方法回调函数接收到。

async函数内部抛出错误,会导致返回的 Promise 对象变为reject状态。抛出的错误对象会被catch方法回调函数接收到。

async function f() {
  throw new Error('出错了');
}
f().then(
  v => console.log('resolve', v),
  e => console.log('reject', e)
)
//reject Error: 出错了

10.3、await 命令

  • await 后面接 Promise

    1.await p1相当于是 p1.then,并且只是成功态的then

    2.await 和 then 的区别就是:then还需要传回调进去,但 await 可以直接得到值

async function(){
  const p1 = Promise.resolve(300) //一个成功态的promise对象,且传了result为300
  const res = await p1 // return 值
  console.log(res) // 300
}
await 和 then 的区别:
fn().then(
  data=>{
    console.log(data)
  }
)
//await直接通过返回值来接收data, return data
const res = await fn()  
  • await 接收值

    1.await后面跟的不是promise对象而是数值时,会自动包装成成功态的promise对象

     2.并且传值给 resolve 为400

async function(){  
  const res = await 400 //Promise.resolve(400) 
  console.log(res) //400
 }
  • await 接 async 函数
async function fn(){
  return 400
}
async function(){
  const res = await fn() //fn()会返回promise对象,原理一样
  console.log(res) //400
}
  • await 接promise 为空

    1.什么都打印不出来

    2.因为 new Promise 里面没有任何状态改变,而await一直在等待状态改变

    3.只有状态改变了,await才会允许执行后面的代码

async function(){
  const p = new Promise(()=>{})
  const res = await p
  console.log(res)
  console.log("success")
}
  • await 接 promise 为 error

     1.会出现报错

     2.await相当于成功态的 .then ,都没有成功,因此不会执行后面的代码

     3.解决:使用 try…catch 偷偷解决掉 error,保证代码运行

——捕获到错误就不会影响后面的输出

async function(){
  const p = Promise.reject("error")
  const res = await p
  console.log(res)
  console.log("success")
})   //什么都打印不出来
async function(){
  const p = Promise.reject("error")
  try{
    const res = await p
    console.log(res)
  }catch(error){
    console.log(error)
  }
  console.log("success")
}   //打印出 error 和 success

10.4、使用await的注意点

1、await命令只能用在async函数之中,如果用在普通函数,就会报错。

2、await命令后面的Promise对象,运行结果可能是rejected,所以最好把await命令放在try...catch代码块中。

console.log(‘reject’, e)
)
//reject Error: 出错了
### 10.3、await 命令
- await 后面接 Promise
  1.await p1相当于是 `p1.then`,并且只是成功态的`then`
  2.await 和 then 的区别就是:then还需要传回调进去,但 await 可以直接得到值
async function(){
const p1 = Promise.resolve(300) //一个成功态的promise对象,且传了result为300
const res = await p1 // return 值
console.log(res) // 300
}
await 和 then 的区别:
fn().then(
data=>{
console.log(data)
}
)
//await直接通过返回值来接收data, return data
const res = await fn()
- await 接收值
  1.await后面跟的不是promise对象而是数值时,会自动包装成成功态的promise对象
  2.并且传值给 resolve 为400
async function(){
const res = await 400 //Promise.resolve(400)
console.log(res) //400
}
- await 接 async 函数
```javascript
async function fn(){
  return 400
}
async function(){
  const res = await fn() //fn()会返回promise对象,原理一样
  console.log(res) //400
}
  • await 接promise 为空

    1.什么都打印不出来

    2.因为 new Promise 里面没有任何状态改变,而await一直在等待状态改变

    3.只有状态改变了,await才会允许执行后面的代码

async function(){
  const p = new Promise(()=>{})
  const res = await p
  console.log(res)
  console.log("success")
}
  • await 接 promise 为 error

    1.会出现报错

    2.await相当于成功态的 .then ,都没有成功,因此不会执行后面的代码

    3.解决:使用 try…catch 偷偷解决掉 error,保证代码运行

——捕获到错误就不会影响后面的输出

async function(){
  const p = Promise.reject("error")
  const res = await p
  console.log(res)
  console.log("success")
})   //什么都打印不出来
async function(){
  const p = Promise.reject("error")
  try{
    const res = await p
    console.log(res)
  }catch(error){
    console.log(error)
  }
  console.log("success")
}   //打印出 error 和 success

10.4、使用await的注意点

1、await命令只能用在async函数之中,如果用在普通函数,就会报错。

2、await命令后面的Promise对象,运行结果可能是rejected,所以最好把await命令放在try...catch代码块中。

目录
相关文章
|
11月前
|
人工智能 JavaScript 前端开发
多角色AI代理的一次尝试- AI代码助手
本文介绍了一个多角色AI代理系统,用于自动化代码开发过程。系统包括用户接口、需求分析、代码结构设计、代码生成、代码审查和代码执行等角色,通过协调工作实现从需求到代码生成与测试的全流程自动化。使用了qwen2.5 7b模型,展示了AI在软件开发中的潜力。
|
人工智能 搜索推荐 算法
曼曼心理咨询【基于ChatGLM-6B微调】
曼曼心理咨询【基于ChatGLM-6B微调】
723 0
|
存储 Java
Java堆和栈的区别和介绍以及JVM的堆和栈
Java堆和栈的区别和介绍以及JVM的堆和栈 一、Java的堆内存和栈内存 Java把内存划分成两种:一种是堆内存,一种是栈内存。 堆:主要用于存储实例化的对象,数组。由JVM动态分配内存空间。一个JVM只有一个堆内存,线程是可以共享数据的。
6032 0
|
存储 SQL Java
Java8 stream 中利用 groupingBy 进行多字段分组求和
Java8 stream 中利用 groupingBy 进行多字段分组求和
|
Web App开发 存储 监控
CentOS7.3下部署Rsyslog+LogAnalyzer+MySQL中央日志服务器
一、简介 1、LogAnalyzer 是一款syslog日志和其他网络事件数据的Web前端。它提供了对日志的简单浏览、搜索、基本分析和一些图表报告的功能。数据可以从数据库或一般的syslog文本文件中获取,所以LogAnalyzer不需要改变现有的记录架构。
2046 0
|
Go API 开发工具
Go etcd 的依赖问题终于解决了。。。
Go etcd 的依赖问题终于解决了。。。
|
缓存 数据可视化 算法
倾斜单体化模型技术实现
倾斜单体化模型技术实现
129 1
|
存储 缓存 NoSQL
redis集群+JedisCluster+lua脚本实现分布式锁
redis集群+JedisCluster+lua脚本实现分布式锁
371 0
|
JSON 前端开发 Java
SpringBoot中jackson日期格式化问题(SerializationFeature.WRITE_DATES_AS_TIMESTAMPS not turning off timestamps)
SpringBoot中jackson日期格式化问题(SerializationFeature.WRITE_DATES_AS_TIMESTAMPS not turning off timestamps)
478 0
|
Java Spring
Spring 注入 Bean 到 List / Map 中
前言 由于在工作中遇到了这样的问题,所以随笔写下来,记录一下。我们平常习惯的注入方式是:@Autowiredprivate 类的名称 对象名称;这种方式是最简单的,也是最实用的。但是有些时候我们就需要将实现了同样接口的Bean注入到Context中,然后可以用 List / Map 接受注入的对象。
3596 0