Promise
Promise是一个内置的构造函数,new出Promise对象,要传入一个回调函数,这个是同步的回调,会立即执行
Promise有3种状态分别是:初始化(pending)、成功(fulfilled)、失败(rejected)
new Promise出实例对象时立刻为初始化(pending)状态,传入2个回调函数,分别是resolve, reject
调用resolve函数会让Promise实例变为成功状态并可以指定成功状态的值(Value), 反之reject为失败
const p = new Promise((resolve, reject) => {
resolve("成功了"); // 指定Promise实例对象状态
// reject("失敗了");
});
// 接收Promise实例对象对象状态返回的值
p.then(
data => {
console.log(data); // 第一个函数成功
},
err => {
console.log(err); // 第二个函数失败
}
);
resolve
Promise.resolve用于快速返回一个成功状态的Promise对象,非Promise值一定为成功,但是传入Promise失败的对象一定失败
const p = Promise.reject(-100)
const p1 = Promise.resolve(p) // 传入非Promise错误状态的值一定为正确的
p1.then(
(value) => console.log('成功了' + value),
(reason) => console.log('失败了' + reason)
) // 失败了-100
const p2 = Promise.resolve(false) // 传入非Promise错误状态
p2.then(
(value) => console.log('成功了' + value),
(reason) => console.log('失败了' + reason)
) // 成功了false
reject
Promise.reject只要调用了reject一定为错误状态
const p = Promise.resolve(-100);
const p1 = Promise.reject(p);
p1.then(
(value) => console.log('成功了' + value),
(reason) => console.log('失败了' + reason)
);
all
传入一个Promise实例的数组,只有当这个数组所有的Promise实例状态为成功时才以数组的形式返回所有Promise实例成功的结果
否则,只要其中一个错误从执行顺序返回第一个报错的Promise实例结果
const p1 = new Promise((resolve, reject) => {
resolve("a");
});
const p2 = Promise.resolve("b");
const p3 = new Promise((resolve, reject) => {
resolve("c");
});
Promise.all([p1, p2, p3]).then(
(vlaue) => console.log("成功了", vlaue),
(reason) => console.log("失败了" + reason)
); // 成功了 [ 'a', 'b', 'c' ]
race
传入一个Promise实例的数组, 对结果没有要求,只返回最快执行完的Promise实例执行的结果
const p1 = new Promise((resolve, reject) => {
setTimeout(() => resolve("c"), 500)
});
const p2 = Promise.resolve("b");
const p3 = new Promise((resolve, reject) => {
setTimeout(() => resolve("c"), 2000)
});
Promise.race([p1, p2, p3]).then(
(vlaue) => console.log("成功了", vlaue),
(reason) => console.log("失败了" + reason)
); // 成功了 b
then
es6解决回调地狱的方法
then中成功回调默认会return undefined,除Promise实例下个then的回调状态必为成功,
下个then的成功与失败取决于上个then返回的Promise实例状态,其他数值皆为成功
ajax("http://jsonplaceholder.typicode.com/posts")
.then(
(data) => {
console.log(data);
return ajax("http://jsonplaceholder.typicode.com/posts"); // 返回Promise可继续then链式调用
},
(reason) => console.log(reason)
)
.then(
(data) => {
console.log(data);
return ajax("http://jsonplaceholder.typicode.com/posts");
},
(reason) => console.log(reason)
)