Promise学习之初步认识Promise

本文主要是介绍Promise学习之初步认识Promise，希望对大家解决编程问题提供一定的参考价值，需要的开发者们随着小编来一起学习吧！

前言

一、认识Promise

(一) 含义

(二) 代码演示

二、Promise状态

三、总结

前言

在上一篇的学习中，我们已经认识到了同步与异步，异步代码在解决同步代码问题的同时，也会产生一些新的问题，比如常说的回调地狱，那为了解决异步带来的回调地狱问题，ES6为我们提供了一个新的对象Promise。

一、认识Promise

(一) 含义

Promise是异步编程的一种解决方案，比较传统的解决方案回调函数和事件更合理也更强大。
Promise是一个用来存储数据的容器，里面保存着异步操作完成的结果

(二) 代码演示

创建Promise对象

const promise = new Promise((resolve, reject) => {// 具体代码// 根据代码执行的结果返回if (成功) {resolve(数据);} else {reject(失败响应);}
});

Promise是一个构造函数，需要通过new创建一个实例对象，并接收两个参数resolve、reject，这两个参数也是函数，通过这两个函数改变Promise状态、存储数据。

通过then方法获取Promise响应

promise.then(res => {// promise执行成功的回调，res返回成功结果
}, err => {// promise执行失败的回调，err返回失败结果
});

案例代码

function sum(a, b) {return new Promise((resolve, reject) => {setTimeout(() => {resolve(a + b);}, 2000);});
}
sum(10, 20).then((res) => {console.log(res);
});

二、Promise状态

Promise状态一共有三个，分别是

pending：初始状态
fulfilled：成功状态，表示异步执行成功
rejected：失败状态，表示异步执行失败

为什么需要Promise状态？

确认异步操作的状态：pending表明正在进行中，如果是fulfilled或rejected就是执行结束了

Promise的状态只会从pending转到fulfilled或rejected其中一个，这是必然的、不可改变的，结果只会是成功或者失败的，一旦fulfilled，那么rejected就不会出现，同理，一旦rejected，fulfilled也不会出现，最终的状态只会是这两个中的一个，也就是Promise（承偌）肯定会给你返回一个结果（成功或失败）

而改变Promise状态的也就是需要到resolve、reject

resolve是执行成功的回调，会在then的触发第一个回调，并在这个回调做成功的对应操作（取数据、跳转页面等等）
reject是执行失败的回调，则会在then的第二个回调中触发，同样也可以在这回调中做操作（错误提示。。。）

const promise = new Promise((resolve, reject) => {if // 执行成功resolve();else // 执行失败reject();
});

根据不同状态的返回，可以通过then来获取，第一个回调获取的成功数据，第二个回调获取的是失败结果

function sum(a, b) {return new Promise((resolve, reject) => {// 成功resolve(a + b);});
}sum(10, 20).then((res) => {console.log("成功结果", res);},(err) => {console.log("失败结果", err);}
);

function sum(a, b) {return new Promise((resolve, reject) => {// 失败reject("异步执行出错了");});
}
sum(10, 20).then((res) => {console.log("成功结果", res);},(err) => {console.log("失败结果", err);}
);

then的第二个回调不仅可以接收reject返回的数据，还可以接收执行异常错误

function sum(a, b) {return new Promise((resolve, reject) => {// 失败throw new Error("异常报错");reject("异步执行出错了");});
}
sum(10, 20).then((res) => {console.log("成功结果", res);},(err) => {console.log("失败结果", err);}
);

三、总结

何为Promise？

为了解决异步代码产生回调地狱问题的一种解决方案

基本语法

const promise = new Promise((resolve, reject) => {// 具体代码// 根据代码执行的结果返回if (成功) {resolve(数据);} else {reject(失败响应);}
});promise.then(res => {// promise执行成功的回调，res返回成功结果
}, err => {// promise执行失败的回调，err返回失败结果
});