javascript 了解es6 Promise

2019-08-22  本文已影响0人  leleo
Promise是什么?

Promise 是一个对象,它代表了一个异步操作的最终完成或者失败。Promise 最直接的好处就是链式调用(chaining)

怎样使用 Promise?

Promise使用方法:

new Promise( function(resolve, reject) {...} /* executor */  );

连续执行两个或者多个异步操作是一个常见的需求,在上一个操作执行成功之后,开始下一个的操作,并带着上一步操作所返回的结果。我们可以通过创造一个 Promise 链来实现这种需求。

var a = 10;
function func() {
    return new Promise((resolve, reject) => {
        //做一些异步操作
        if(a == 10){
            resolve();
        }else {
            reject();
        }
    })
}

func().then(() => {
    console.log(1);
    return func();
}).then(() => {
    console.log(2);
    return func();
}).catch(() => {
   console.log('失败');
});
// 输出 1 2
Promise.then()

then方法有两个参数,第一个参数是resolve(成功),第二个参数是reject(失败)

var a = 10;
function func() {
    return new Promise((resolve, reject) => {
        //做一些异步操作
        if(a == 10){
            resolve();
        }else {
            reject();
        }
    })
}
func().then(() => {
    console.log('成功!');
},()=> {
    console.log('失败!');
});
// 如果a = 10,输出 成功
// 如果a != 10,输出 失败
Promise.all()

把promise打包后生成一个数组,打包完还是一个promise对象
注意:用all方法必须保证所有的promise对象都是resolve(成功)状态

var a = 10;
function func1() {
    return new Promise((resolve, reject) => {
        //做一些异步操作
        if(a == 10){
            resolve(1);
        }
    })
}
function func2() {
    return new Promise((resolve, reject) => {
        //做一些异步操作
        if(a == 10){
            resolve(2);
        }
    })
}

let p1 = func1((res) => {});
let p2 = func2((res) => {});

Promise.all([p1, p2]).then(res => {
  console.log(res);
}); 

// 输出 [1,2]
Promise.race()

race方法只返回一个成功就会输出,哪个速度快就输出哪个

var a = 10;
function func1() {
    return new Promise((resolve, reject) => {
        //做一些异步操作
        if(a == 10){
            resolve(1);
        }
    })
}
function func2() {
    return new Promise((resolve, reject) => {
        //做一些异步操作
        if(a == 10){
            resolve(2);
        }
    })
}
let p1 = func1((res) => {});
let p2 = func2((res) => {});

Promise.race([p1, p2]).then(res => {
  console.log(res);
}); 
// 输出 1
Promise.catch()

catch其实就是then方法里的第二个错误参数的别名,它们两个的输出是一样的

var a = 10;
function func() {
    return new Promise((resolve, reject) => {
        //做一些异步操作
        if (a == 1) {
            resolve(1);
        } else {
            reject('失败,失败中的失败!');
        }
    })
}
func().catch(err => {
    console.log(err);
});

// 输出 '失败,失败中的失败!'
Promise.resolve()

将现有的东西转成一个promise对象,而且是resolve成功状态

const p1 = Promise.resolve('a');
p1.then(res => {
    console.log(res);
})
// 输出 a
Promise.reject

将现有的东西转成一个promise对象,而且是reject失败状态

const p1 = Promise.reject('a');
p1.catch(err => {
    console.log(err);
})
// 输出 a

常见错误

  1. 使用 Promise的时候,如果有链式操作的时候,最好不要使用 Promise嵌套 Promise使用,这样会打破链条。
  2. 每次使用Promise都需要用 catch 来终止链链条。
上一篇下一篇

猜你喜欢

热点阅读