Promise是es6中新增加的类(new Promise),目的为了管理JS中异步编程,也叫“Promise”设计模式

Promise用来解决异步问题。本身是同步的,只是用来管理异步编程的一种模式

所谓Promise,简单说就是一个容器(壳子),里面保存着某个未来才会结束的事件(通常是一个异步操作)的结果

promise对象是一个构造函数,本身有resolve、reject、all方法,原型上有then、catch等方法

三种状态

  • pending 准备状态
  • fulfilled 成功状态(resolve)
  • rejected 失败状态(reject)

最终只有两个状态,1、准备 2、成功或者失败

   let p = new Promise((resolve,reject)=>{
setTimeout(function(){
let txt = '呼伦贝尔';
resolve(txt)//resolve时候执行成功的 呼伦贝尔
//reject(err) //reject时候执行失败的 err
},1000)
});
p.then((data)=>{
console.log(data);
},(err)=>{
console.log('err')
})
/*
1、异步操作放在Promise传的函数里面
2、Promise的参数与 then的参数相对应
*/

Promise对象的特点

  1. Promise对象的状态不受外界影响。只有异步操作的结果,可以决定当前是哪一种状态,任何其他操作都无法改变这个状态
  2. 一旦状态改变,就不会再变。Promise对象的状态改变,只有两种可能:从pending变为fulfilled和从pending变为rejected

promise中excutor执行器,默认new时候会立即调用

每一个promise的实例上都有一个then方法,用来指定resolved和rejected状态的回调函数

其中then方法可以写多个链式调用(前提需要保证执行完then返回的依然是promise实例)

    let pro = new Promise((resolve,reject) =>{
//执行一个异步操作
let xhr = new XMLHttpRequset();
xhr.open('get','1.js',true);
xhr.onreadyStatechange() = function(){
if(xhr.readyState === 4 && xhr.status === 200){
val = xhr.responseText;
resolve(val);//成功
}
if(xhr.status!==200){
reject();//失败
}
}
xhr.send();
})
pro.then((resolve)=>{
console.log('ok');
//数据绑定
},(reject)=>{
console.log('error');
}).then(()=>{
//当第一个then中的函数执行完,会执行第二个
}).then(()=>{
//当第二个then中的函数执行完,会执行第三个
})

promise支持多个并发的请求,获取并发中的数据

Promise请求过来的数据,可能是null,也可能是数组,是数组就进then()遍历,返回的null不需要then()

promise.prototype.catch()

该方法是.then(null, rejection)的别名,用于指定发生错误时的回调函数

 getJSON('/bosh.json').then(function(bosh){
//...
}).catch(function(err){
// 处理 getJSON 和 前一个回调函数运行时发生的错误
console.log('发生错误!', error);
})

一般来说,不要在then方法里面定义reject 状态的回调函数(即then的第二个参数)

也就是在then里面执行成功信息,在catch里面执行错误信息

  // 不推荐
promise
.then(function(data) {
// success
}, function(err) {
// error
}); // 推荐
promise
.then(function(data) { //cb
// success
})
.catch(function(err) {
// error
});

promise.all

Promise.all方法用于将多个 Promise 实例,包装成一个新的 Promise 实例。返回的每个成员都是 Promise 实例

等待所有的promise都成功执行then,反之只要有一个失败就会执行catch

Promise.all([p1,...]).then();

Promise异步操作的更多相关文章

  1. ES6 Promise 异步操作

    最近越来越喜欢与大家进行资源分享了,并且及时的同步到自己的园子内,为什么呢? 一.小插曲(气氛搞起) 在上个月末,由于领导的高度重视(haha,这个高度是有多高呢,185就好了),走进了公司骨干员工的 ...

  2. promise实现原理

    先看的这篇有问题的文章 花了很长时间研究这篇文章,卡在实现串行Promise那儿了,一直看不明白.就在刚才,发现这篇文章是错的,在第一次用setTimeout( ,0)那儿就错了.虽然用setTime ...

  3. 手把手教你实现一个完整的 Promise

    用过 Promise,但是总是有点似懂非懂的感觉,也看过很多文章,还是搞不懂 Promise的 实现原理,后面自己边看文章,边调试代码,终于慢慢的有感觉了,下面就按自己的理解来实现一个 Promise ...

  4. Promise和异步编程

    前面的话 JS有很多强大的功能,其中一个是它可以轻松地搞定异步编程.作为一门为Web而生的语言,它从一开始就需要能够响应异步的用户交互,如点击和按键操作等.Node.js用回调函数代替了事件,使异步编 ...

  5. 对于ES6中Promise的个人见解

    1.js中常见的异步 JavaScript可以响应用户的一些异步交互,比如单击鼠标和按键盘等操作. let button = document.getElementById("btn&quo ...

  6. promise应用及原生实现promise模型

    一.先看一个应用场景 发送一个请求获得用户id, 然后根据所获得的用户id去执行另外处理.当然这里我们完全可以使用回调,即在请求成功之后执行callback; 但是如果又添加需求呢?比如获得用户id之 ...

  7. 30分钟,让你彻底明白Promise原理

    前言 前一阵子记录了promise的一些常规用法,这篇文章再深入一个层次,来分析分析promise的这种规则机制是如何实现的.ps:本文适合已经对promise的用法有所了解的人阅读,如果对其用法还不 ...

  8. 初步认识Promise

    在解释什么是Promise之前,先看一道练习题,做完练习题也就知道Promise到底是干嘛用的了. 假设现在有个需求:你要封装一个方法,我给你一个要读取文件的路径,你这个方法能帮我读取文件,并把内容返 ...

  9. promise的生命周期

    每个promise都会经历一个短暂的生命周期: 先是处于进行中(pending)状态,此时操作并未完成,所以他也是未处理的(unsettled): 一旦异步惭怍执行结束,promise则 变为已处理( ...

随机推荐

  1. React.js开发的基本配置(配了两天)

    记录下心酸的过程: 1.安装npm 安装node.js,这时候你就可以使用npm了. 因为官方的源下载npm的包比较慢,所以可以用淘宝的源,这时候使用nrm来进行npm源的切换 在cmd中执行 npm ...

  2. 如何用php实现分页效果

    分页效果在网页中是常见的,可是怎样才能实现分页呢,今天做了两种方法来实现一下分页的效果 首先,我们需要准备在数据库里面准备一个表,并且插入数据,这些都是必需的前提工作了,不多说,如图所示(库名为jer ...

  3. ###20175311MyCP(课下作业,必做)

    MyCP(课下作业,必做) 作业题目 编写MyCP.java 实现类似Linux下cp XXX1 XXX2的功能,要求MyCP支持两个参数: java MyCP -tx XXX1.txt XXX2.b ...

  4. 时序数据库InfluxDB:简介及安装

    在性能测试过程中,对测试结果以及的实时监控与展示也是很重要的一部分.这篇博客,介绍下linux环境下InfluxDB的安装以及功能特点. 官网地址:influxdata 官方文档:influxdb文档 ...

  5. 解决 Intellij IDEA Cannot Resolve Symbol ‘XXX’ 问题

    1.java类报错 https://blog.csdn.net/qq_32040767/article/details/77096680 2.类对应的依赖没有加载进来.编译器自身的设置和缓存问题类. ...

  6. 基于 HTML5 WebGL 的 3D 工控裙房系统

    前言 工业物联网在中国的发展如火如荼,网络基础设施建设,以及工业升级的迫切需要都为工业物联网发展提供了很大的机遇.中国工业物联网企业目前呈现两种发展形式并存状况:一方面是大型通讯.IT企业的布局:一方 ...

  7. docker 在centos6 和centos7上的区别

    这些天研究了下docker,在centos6.6上装了个docker1.7.1,在centos7.6上装了个docker18.09.0 两者还是有区别的. 1.配置docker国内镜像加速  Dock ...

  8. [Alpha阶段]第六次Scrum Meeting

    Scrum Meeting博客目录 [Alpha阶段]第六次Scrum Meeting 基本信息 名称 时间 地点 时长 第六次Scrum Meeting 19/04/10 教2 1层 50min 相 ...

  9. [Alpha阶段]第五次Scrum Meeting

    Scrum Meeting博客目录 [Alpha阶段]第五次Scrum Meeting 基本信息 名称 时间 地点 时长 第五次Scrum Meeting 19/04/09 教1_2楼教室 65min ...

  10. openstack搭建之-glance配置(9)

    一. base节点配置 #设置数据库,创建glance数据库,并设置权限 mysql -u root -proot CREATE DATABASE glance; GRANT ALL PRIVILEG ...