您好,欢迎来到二三四教育网。
搜索
您的当前位置:首页初识promise

初识promise

来源:二三四教育网

Promise是ES6新出的一个构造函数,最主要的就是为了解决回调地狱的问题。Promise三个状态:pending初始状态,fulfilled(resolve)成功状态,rejected(reject)失败状态。

语法:

new Promise( function(resolve, reject) { } );

Promise构造函数接收一个函数为参数,这个函数接收两个函数参数一个是成功resolve,一个是失败reject。

先看一下最简单的例子:

var promise = new Promise(function (resolve, reject) {
    var num = parseInt(Math.random() * 10);
    if(num > 5){
        resolve(num);
    }else{
        reject('失败了');
    }
});

promise.then(function (value) {
    console.log(value);
}).catch(function (value) {
    console.log(value);
});

随机数大于5就是成功,否则失败。这样一看好像没什么太大的用处,用回调就能解决。确实,如果只是普通的方法或者是只用一次两次的方法,没必要使用Promise,但是封装一个公用的方法,注意是公用方法,意思就是会一直调用,比如ajax、axios或者选择文件方法封装等就很有用。

简单链式调用:

new Promise(function(resolve, reject){
    console.log(100)
    resolve();
}).then(function(resolve, reject) {
    for(var i = 0; i < 10000;i++){
        console.log(200)
    };
}).then(function(resolve, reject)  {
    console.log(300)
});

这样的链式调用会严格按顺序执行,且第一个可以判断成功失败是否执行,但是其他无法拦截失败,虽然这有点旁门左道,但是本人认为有时候简单使用还是可以的。

标准链式调用:

Promise在then方法里面返回一个Promise对象,就可以直接链式调用。

new Promise(function(resolve, reject){
    resolve('star');
}).then(function(data){
    console.log('two: ', data);
    return new Promise(function(resolve, reject){
        resolve('two result');
    });
}).then(function(data){
    console.log('three: ', data);
    return new Promise(function(resolve, reject){
        resolve('three result');
    });
}).then(function(data){
    console.log('end result: ', data);
}).catch(function(err){
    console.log('err: ', err);
});

在return的Promise里面如果是reject,那么会直接执行最后的catch方法。虽然成功是不会执行catch方法,但是最好都写上,就好比switch的default一样。

欢迎关注Coding个人笔记 公众号

Copyright © 2019- how234.cn 版权所有 赣ICP备2023008801号-2

违法及侵权请联系:TEL:199 1889 7713 E-MAIL:2724546146@qq.com

本站由北京市万商天勤律师事务所王兴未律师提供法律服务