走进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代码块中。

目录
相关文章
|
8月前
|
机器学习/深度学习 数据挖掘 C语言
python数据分析——Python语言基础(语法基础)
对于学过C语言的人来说,python其实很简单。学过一种语言,学习另一种语言,很显然的能感觉到,语言大体上都是相通的。当然,没学习过C语言,不是就不能学习python,python相对于其他语言,还是入手最简单的。
64 0
|
8月前
|
Java 编译器 Go
【字节跳动青训营】后端笔记整理-1 | Go语言入门指南:基础语法和常用特性解析(一)
本文主要梳理自第六届字节跳动青训营(后端组)-Go语言原理与实践第一节(王克纯老师主讲)。
213 1
|
7月前
|
分布式计算 NoSQL Spark
技术好文:scyllaDB基本使用
技术好文:scyllaDB基本使用
|
8月前
|
存储 JSON Java
【字节跳动青训营】后端笔记整理-1 | Go语言入门指南:基础语法和常用特性解析(三)
在 Go 语言里,符合语言习惯的做法是使用一个单独的返回值来传递错误信息。
106 0
|
8月前
|
存储 Go C++
【字节跳动青训营】后端笔记整理-1 | Go语言入门指南:基础语法和常用特性解析(二)
Go 语言中的复合数据类型包括数组、切片(slice)、映射(map)和结构体(struct)。
86 0
|
8月前
|
存储 程序员 开发工具
Python 进阶指南(编程轻松进阶):十四、实践项目
Python 进阶指南(编程轻松进阶):十四、实践项目
59 0
|
Go 开发者
长文回顾Go语言基础语法 新手进阶必读
长文回顾Go语言基础语法 新手进阶必读
53 0
长文回顾Go语言基础语法 新手进阶必读
|
算法 JavaScript 网络架构
走进ES6的世界:基础语法入门指南2
走进ES6的世界:基础语法入门指南
53 0
|
JSON 前端开发 JavaScript
走进ES6的世界:基础语法入门指南3
走进ES6的世界:基础语法入门指南
56 0
|
JavaScript 前端开发 安全
走进ES6的世界:基础语法入门指南1
走进ES6的世界:基础语法入门指南
100 0

热门文章

最新文章

下一篇
开通oss服务