首先来说下同步异步与阻塞非阻塞的概念,同步异步与阻塞非阻塞并没有关系。同步异步主要是事情做完以后,如何进行处理、或者说关注的是一种消息通信机制。

同步的情况下,是由处理消息者自己去等待消息是否被触发;

而异步的情况下是由触发机制来通知处理消息者

举例:

所以同步异步可以说是对被请求方来说的,被请求者使用什么方式来告知处理结果

  • 思考,思考。。。。。。。,好了,有答案了,当场告诉你 -------- 同步
  • 这个问题需要一点时间,你先做点别的,等我想好了,去找你。 --------异步

阻塞非阻塞,主要是对于请求者而言的

  • 阻塞:发出请求等待结果返回,然后再处理后续的事情
  • 非阻塞:发出请求不等待结果返回,可以接着做后续的事情

上代码:

/**当我们new Promise会得到一个Promise对象,该对象会有一个任务要完成,同时该对象会维护一个状态
PromiseStatus
1:pending:正在处理
2:resolved:已完成
3:rejected:失败*/ let p1 = new Promise(function(resolve,reject){ /**要做的事情通过一个函数来完成,该函数会接收两个值
resolve
reject
这两个参数都是一个函数,当我们调用他们的时候,会改变当前任务的状态
resolve() => resolved
reject() => rejected */ setTimeout(() => {
var a = Math.random();
if(a < 0.5){
console.log(a,'p1失败')
reject(a)
}else{
console.log(a,'p1成功')
resolve(a)
}
},1000)
}) /**Promise对象还有一个then方法,当前任务成功的时候,会调用该方法,并执行该方法传入函数参数
then方法接收两个参数,它们都是函数
第一个参数是当前状态为resolved时候执行
第二个参数是当前状态为rejected时候执行*/ p1.then(a => {
console.log('成功',a)
},a => {
console.log('失败',a)
}) /**虽然then方法中的参数接收两个
一个是成功的callback
一个是失败的callback
但是,在书写的时候,如果每一个then都传这两个callback的话,编写过程太麻烦,为了能够统一的处理失败Pormise对象又提供了一个新的方法:catch,catch方法也接收一个callback
只要有一个Promise的状态变成了rejected,那么就会被catch方法捕获,执行catch的callback*/ .then((a) => {
return new Promise((resolve,reject) => {
setTimeout(() => {
a *= a;
console.log(a,'p1成功')
reject(a);
},1000)
})
}).then((a) => {
console.log(a,'p1的then里成功')
}).catch((a) => {
console.log(a,'失败捕获')
})

看打印出来的结果:

当p1中的随机数a < 0.5时,就直接进入catch里捕获到失败了,后面的then都不会执行

当p1中的随机数a > 0.5时,就进入到第一个then里,第一个then里又有一个promise对象,但是执行的是reject函数,所以就会直接到catch里捕获到失败

情形:在一个Promise任务中需要处理多个异步任务,这多个的异步任务是同时进行的,但是执行时间是不确定的,后续的任务需要这几个异步任务全部完成之后在执行,这时候就需要用到Promise里面提供的all方法来实现

var p1 = new Promise((resolve,reject) => {
let a = 1;
setTimeout(() => {
a++;
resolve(a);
},Math.random() * 1000)
}) var p2 = new Promise((resolve,reject) => {
let b = 2;
setTimeout(() => {
b++;
resolve(b);
},Math.random() * 1000)
}) /**把两个不同的异步任务分别包装在一个Promise对象里,然后调用Promise对象静态方法all,把上面多个不同异步Promise作为数组传递给all方法的参数,当多个异步任务的状态都变成resolve,那么all的状态才是resolved,但是只要有一个异步任务的状态变成了rejected,那么all的状态就会变成rejected*/ Promise.all([p1,p2]).then(([a,b]) => {
console.log(a,b)
}).catch((err) => {
console.log(err)
})

打印台:

over~

promise对象里resolve和reject状态讲解及Promise.all()的使用的更多相关文章

  1. 彻底理解Promise对象——用es5语法实现一个自己的Promise(上篇)

    本文同步自我的个人博客: http://mly-zju.github.io/ 众所周知javascript语言的一大特色就是异步,这既是它的优点,同时在某些情况下也带来了一些的问题.最大的问题之一,就 ...

  2. Promise对象的resolve回调函数和reject回调函数使用

    Promise是ES6中用来结局回调地狱的问题的但是并不能帮我们减少代码量 Promise是一个构造函数 new Promise() 得到一个Promise一个实例 在Promise上有两个函数分别是 ...

  3. JavaScript异步与Promise基本用法(resolve与reject)

    Promise解决的问题相信每个前端都遇到过这样一个问题,当一个异步任务的执行需要依赖另一个异步任务的结果时,我们一般会将两个异步任务嵌套起来,这种情况发生一两次还可以忍,但是发生很多次之后,就形成了 ...

  4. resolve和reject不会终结Promise的参数函数的执行

  5. 16. Promise对象

    目录 Promise对象 一.含义 1. Promise是什么 2. 实例讨论 二.Promise特性案例解析 1. Promise的立即执行性 2. promise的三种状态 3. Promise的 ...

  6. 谈谈 ES6 的 Promise 对象

    https://segmentfault.com/a/1190000002928371 前言 开篇首先设想一个日常开发常常会遇到的需求:在多个接口异步请求数据,然后利用这些数据来进行一系列的操作.一般 ...

  7. Promise原理讲解 && 实现一个Promise对象 (遵循Promise/A+规范)

    1.什么是Promise? Promise是JS异步编程中的重要概念,异步抽象处理对象,是目前比较流行Javascript异步编程解决方案之一 2.对于几种常见异步编程方案 回调函数 事件监听 发布/ ...

  8. JavaScript异步编程(1)- ECMAScript 6的Promise对象

    JavaScript的Callback机制深入人心.而ECMAScript的世界同样充斥的各种异步操作(异步IO.setTimeout等).异步和Callback的搭载很容易就衍生"回调金字 ...

  9. 通过一道笔试题浅谈javascript中的promise对象

    因为前几天做了一个promise对象捕获错误的面试题目,所以这几天又重温了一下promise对象.现在借这道题来分享下一些很基础的知识点. 下面是一个面试题目,三个promise对象捕获错误的例子,返 ...

随机推荐

  1. 手机app抓包[小米]

    方案一:(手机电脑在同一wifi下) 打开burp设置代理 这里的ip为电脑的ip 手机手动设置代理为电脑的ip+8080 导入证书 电脑上下载下证书(http://burp) 传到手机上

  2. JS面向对象编程之封装

    来源:https://segmentfault.com/a/1190000015843072 我们所熟知的面向对象语言如 C++.Java 都有类的的概念,类是实例的类型模板,比如Student表示学 ...

  3. mysql 复制表结构和数据

    CREATE TABLE 新表名 SELECT 字段 as 新字段,字段 as 新字段.....from 旧表名:

  4. JS编程建议——11:慎重使用伪数组

    建议11:慎重使用伪数组JavaScript没有真正的数组,因此typeof运算符不能辨别数组和对象.伪数组在JavaScript中有很高的易用性,程序员不用给它设置维度,而且永远不用担心产生越界错误 ...

  5. 数学--数论--HDU--5878 Count Two Three 2016 ACM/ICPC Asia Regional Qingdao Online 1001

    I will show you the most popular board game in the Shanghai Ingress Resistance Team. It all started ...

  6. Appium-desktop 元素定位

    1.打开 appium-desktop ,点击 start session 2.打开后,点击屏幕右上角的搜索按钮 3.然后会打开配置页面,在本地服务配置信息同上面写的代码链接配置.填入正确的信息后,点 ...

  7. python(索引/切片)

    一.索引 1.索引值从左到右-->从0开始,索引值从右到左-->从-1开始 取值格式var[index] >>> name = "xinfangshuo&quo ...

  8. 2-MyBatisPlus教程(HelloWorld)

    1,准备数据 DROP TABLE IF EXISTS user; CREATE TABLE user ( id ) NOT NULL COMMENT '主键ID', name ) NULL DEFA ...

  9. CSS的基本语法及页面引用

    CSS的基本语法及页面引用 CSS基本语法 CSS的定义方法是: 选择器 { 属性:值; 属性:值; 属性:值;} 选择器是将样式和页面元素关联起来的名称,属性是希望设置的样式属性每个属性有一个或多个 ...

  10. JAVA基础篇 之 方法的重载

    ​ 任何程序语言都具备了一项重要的特性就是对名字的运用.当创建一个对象时,也就给此对象分配到的存储空间取了一个名字.所谓方法则是给某个动作取的名字.通过使用名字你可以引用所有的对象和方法. ​ 将人类 ...