Promise与async/await
- 为什么要使用他们
- 如何使用.then() 和.catch()
- 如何将相同的代码转换成sync和Await关键字
为什么要使用他们
前面学习了JavaScript的简单类型(例如 数字和字符串),我们的代码会按顺序从上往下执行
console.log(1111);
console.log(2222);
console.log(3333);
但是在实际项目中,我们经常执行长时间的任务,例如: 调用数据库打开文件 、远程调用api 进行交互等、订阅消息
通常不会立刻返回结果。很多是返回一个Promise
(承诺)
Promise 是javaScript中一个特殊类型对象,代表异步操作的最终完成或失败
node项目内添加axios模块
npm i --save axios
在index.js
里添加下面,我们用axios 调用get方法
const axiosRequest = require('axios')let response = axiosRequest.get("https://XXXX/prod-api/captchaImage");console.log(response.data);
命令行运行js,执行报错
node index.js
因为响应对象不是我们期望的,修改控制台输出命令,直接输出response
如何使用.then() 和.catch()
javaScript提供了两个方法
在Promise对象上使用一些特殊方法,当任务完成时,
该函数将在 promise resolved 且接收到结果后执行
promise.then(function(result) { /* handle a successful result */ },function(error) { /* handle an error */ }
);
.then 的第一个参数是一个函数,该函数将在 promise resolved 且接收到结果后执行。
.then 的第二个参数也是一个函数,该函数将在 promise rejected 且接收到 error 信息后执行。
const axiosRequest = require('axios')axiosRequest
.get("https://XXXX/prod-api/captchaImage")
.then(response => {console.log(`you could ${response.data.img}`)})
.catch(error =>{console.error(`ERROR ${error}`);});
如何将相同的代码转换成sync和Await关键字
await 允许我们等到 Promise 完成后再转下一行,更加整洁且易于阅读,javaScript要求我们的await关键字 在标有sync关键字函数内使用,所以让我们带有sync关键字标记的函数代替我们Promise 链
const axiosRequest = require('axios')async function getMsg(){let response = await axiosRequest.get("https://XXXX/prod-api/captchaImage1")console.log(`you could ${response.data.msg}`); }getMsg();
如何捕获异常
const axiosRequest = require('axios')axiosRequest
.get("https://XXXX/prod-api/captchaImage1").then(response => {console.log(`you could ${response.data.img}`)}).catch(error =>{console.error(`ERROR ${error}`);});