初识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个人笔记(gh_2ce38b49dae1),作者:wade

原文出处及转载信息见文内详细说明,如有侵权,请联系 yunjia_community@tencent.com 删除。

原始发表时间:2018-11-14

本文参与腾讯云自媒体分享计划,欢迎正在阅读的你也加入,一起分享。

我来说两句

0 条评论
登录 后参与评论

相关文章

  • Promise的几个方法

    我们都会觉得虽然是链式调用,对比回调会清晰一点,但是并没有想象中的那么美好。所以Promise提供了几个方法。

    wade
  • Promise其它方法一

    这个是最简单的,catch其实就是没有成功方法resolve的then函数,所以catch方法:

    wade
  • 我理解的作用域

    JavaScript开发中,作用域算是难点和一大核心,作用域的理解很深,我可能会另外再写一些,先写一下目前为止理解到的层次。

    wade
  • ES6笔记(7)-- Promise异步编程

    Promise是一种异步编程的解决方案,本质来说其实它是一种规范,Promises/A+规范

    书童小二
  • ES6 Promise

    Promise 的状态只有两种可能,从 pending 变为 fulfilled 和 从 pending 变为 rejected,一旦状态变化,就不会再改变

    Leophen
  • JavaScript设计模式--代理模式

    代理模式:为一个对象提供一个代用品或占位符,以便控制对它的访问。 代理分为:保护代理和虚拟代理 保护代理:用于控制不同权限的对象对目标对象的访问,在Ja...

    奋飛
  • 为博客园添加目录的方法总结

    参考链接: http://www.cnblogs.com/xdp-gacl/p/3718879.html#2937655 http://www.cnblog...

    shirayner
  • 博客园_01_为博客园添加目录的方法总结

    本文转自:作者:妙音天女    地址:http://www.cnblogs.com/xuehaoyue/p/6650533.html

    shirayner
  • Python-定时器使用

    通过crontab -e命令,添加定时器任务。定期执行python的脚本。如果-e后面是多条命名,可以用分号”;”进行分割。用分号 (;) 所分割的话,那么命令...

    py3study
  • python函数修饰符@的使用方法解析

    版权声明:本文为博主原创文章,遵循 CC 4.0 BY-SA 版权协议,转载请附上原文出处链接和本声明...

    于小勇

扫码关注云+社区

领取腾讯云代金券