Promise 对象

异步编程 方案,已同步的方式表达异步的代码,解决回调地狱的问题

比传统的解决方案——回调函数事件——更合理和更强大

是一个容器,里面保存着某个未来才会结束的事件(通常是一个异步操作)的结果。

从语法上说,Promise 是一个对象,从它可以获取异步操作的消息。

Promise 提供统一的 API,各种异步操作都可以用同样的方法进行处理

  • 基本使用
  • const promise = new Promise(function(resolve, reject) {
    // ... some code if (/* 异步操作成功 */){
    resolve(value);
    } else {
    reject(error);
    }
    }); promise
    .then(
    ()=>{
    console.log('成功的回调');
    },
    ()=>{
    console.log('失败的回调');
    },
    );
    console.log('主线程执行完了'); /**** 等同于 ****/
    const promise = new Promise((resolve, reject)=>{
    /*
    resolve 解决 成功 将 Promise 对象的状态 由初始化变成成功
    reject 拒绝 失败 将 Promise 对象的状态 由初始化变成失败 Promise 三种状态
    初始化状态
    成功状态
    失败状态
    */
    setTimeout(function(){
    const result = 202;
    console.log('请求成功了');
    resolve(result); // 触发成功的回调
    }, 1000);
    }); promise.then(result=>{
    console.log('成功的回调'+result);
    }).catch((result)=>{
    console.log('失败的回调'+result);
    });
    console.log('主线程执行完了');
  • Promise.resolve() 和 Promise.reject()    创建对象,状态为 成功 和 失败
  • Promise.all([要检测的对象数组]);    // 在所有的 promise 都触发 resolve 回调,才会成功。
  • 成功时接收 resolve ,失败只接收 reject。结果为数组
  • 实例
  • /**** 简单 独立异步任务 ****/
    const a = new Promise((resolve, reject)=>{
    setTimeout(function(){
    resolve("成功!");
    }, 1000);
    }); const aa = new Promise((resolve, reject)=>{
    setTimeout(function(){
    resolve("成功!");
    }, 2000);
    }); const aaa = new Promise((resolve, reject)=>{
    setTimeout(function(){
    resolve("成功!");
    }, 3000);
    }); Promise.all([a, aa, aaa]).then(result=>{
    console.log(result); // 接收到数组是 每个 Promise 发送过来的结果
    }).catch(result=>{
    console.log(result);
    }); console.log('主线程执行完了!'); /**** 复杂 分线程关联任务 ****/
    const b = new Promise((resolve, reject)=>{
    setTimeout(function(){
    console.log("Done1"+"First");
    resolve("Done1"+"First");
    }, 1000);
    }); b.then(result=>{
    return new Promise((resolve, reject)=>{
    setTimeout(function(){
    console.log("Done2"+result);
    resolve("Done2"+result);
    }, 2000);
    });
    }).catch()
    .then(result=>{
    return new Promise((resolve, reject)=>{
    setTimeout(function(){
    console.log("Done3"+result);
    resolve("Done3"+result);
    }, 3000);
    });
    }).catch()
    .then(result=>{
    console.log("All Done!"+result);
    }).catch() console.log('主线程执行完了!');

ECMA Script 6_异步编程之 Promise的更多相关文章

  1. 异步编程之Promise(3):拓展进阶

    异步编程系列教程: (翻译)异步编程之Promise(1)--初见魅力 异步编程之Promise(2):探究原理 异步编程之Promise(3):拓展进阶 异步编程之Generator(1)--领略魅 ...

  2. 异步编程之Promise(2):探究原理

    异步编程系列教程: (翻译)异步编程之Promise(1)--初见魅力 异步编程之Promise(2):探究原理 异步编程之Promise(3):拓展进阶 异步编程之Generator(1)--领略魅 ...

  3. (翻译)异步编程之Promise(1):初见魅力

    原文:https://www.promisejs.org/ by Forbes Lindesay 异步编程系列教程: (翻译)异步编程之Promise(1)--初见魅力 异步编程之Promise(2) ...

  4. 前端异步编程之Promise和async的用法

    传统的异步解决方案采用回调函数和事件监听的方式,而这里主要记录两种异步编程的新方案: ES6的新语法Promise ES2017引入的async函数 Generator函数(略) Promise的含义 ...

  5. JavaScript的异步编程之Promise

    Promise 一种更优的异步编程统一 方法,如果直接使用传统的回调函数去完成复杂操作就会形成回调深渊 // 回调深渊 $.get('/url1'() => { $.get('/url2'() ...

  6. 异步编程之Generator(1)——领略魅力

    异步编程系列教程: (翻译)异步编程之Promise(1)--初见魅力 异步编程之Promise(2):探究原理 异步编程之Promise(3):拓展进阶 异步编程之Generator(1)--领略魅 ...

  7. 异步编程之co——源码分析

    异步编程系列教程: (翻译)异步编程之Promise(1)--初见魅力 异步编程之Promise(2):探究原理 异步编程之Promise(3):拓展进阶 异步编程之Generator(1)--领略魅 ...

  8. 异步编程之Generator(2)——剖析特性

    异步编程系列教程: (翻译)异步编程之Promise(1)--初见魅力 异步编程之Promise(2):探究原理 异步编程之Promise(3):拓展进阶 异步编程之Generator(1)--领略魅 ...

  9. Javascript异步编程之setTimeout与setInterval详解分析(一)

    Javascript异步编程之setTimeout与setInterval 在谈到异步编程时,本人最主要会从以下三个方面来总结异步编程(注意:特别解释:是总结,本人也是菜鸟,所以总结不好的,请各位大牛 ...

随机推荐

  1. Hadoop记录-metastore jmx配置

    参考:http://www.lixiuliang.cn/categories/%E5%A4%A7%E6%95%B0%E6%8D%AE/ 1.修改bin/hive文件 添加jvm启动参数: if [ $ ...

  2. 第十五节: EF的CodeFirst模式通过DataAnnotations修改默认协定

    一. 简介 1. DataAnnotations说明:EF提供以特性的方式添加到 domain classes上,其中包括两类:  A:System.ComponentModel.DataAnnota ...

  3. css中的数学表达式calc()

    前言 数学表达式calc()是CSS中的函数,主要用于数学运算.使用calc()为页面元素布局提供了便利和新的思路. 概念 数学表达式calc()是calculate计算的缩写,它允许使用+.-.*. ...

  4. vue 开发微信小程序

    介绍 mpvue (github 地址请参见)是一个使用 Vue.js 开发小程序的前端框架.框架基于 Vue.js 核心,mpvue 修改了 Vue.js的 runtime 和 compiler 实 ...

  5. JavaScript 的正则也有单行模式了

    正则表达式最早是由 Ken Thompson 于 1970 年在他改进过的 QED 编辑器里实现的,正则里最简单的元字符 “.” 在当时所匹配的就是除换行符外的任意字符: "." ...

  6. CentOS/Linux开放某些端口

    CentOS/Linux开放某些端口 CentOS/Linux 装载系统的时候只开启了少数端口如22,80(有些连80都没有开放)等. 结果再装完Nginx+PHP+MySQL 后不能访问网站. 当然 ...

  7. JAVA进阶6

    间歇性混吃等死,持续性踌躇满志系列-------------第6天 1.数组 package cn.intcast.day06.demo01; /* 直接打印数组名称,得到的是数组对应的内存地址的哈希 ...

  8. Spring系列(零) Spring Framework 文档中文翻译

    Spring 框架文档(核心篇1和2) Version 5.1.3.RELEASE 最新的, 更新的笔记, 支持的版本和其他主题,独立的发布版本等, 是在Github Wiki 项目维护的. 总览 历 ...

  9. 关于Linux的随笔笔记

    1.Ctrl+c.Ctrl+z和Ctrl+d的区别: Ctrl+c和Ctrl+z都是中断命令,但是他们的作用却不一样: Ctrl+c 是向当前进程发送SIGINT信号,用于终止进程: Ctrl+z 是 ...

  10. Eclipse编译运行没问题,但执行mvn clean install跑单元测试失败的原因解析

    问题描述:mvn clean install编译工程并运行单元测试出现如下错误 Tests run: 3, Failures: 0, Errors: 2, Skipped: 0, Time elaps ...