promise出现的目的一为处理JavaScript里的异步,再就是避免回调地狱。 promise有三种状态:pending/reslove/reject 。

pending就是未决,resolve可以理解为成功,reject可以理解为拒绝。 promise的最终状态会凝固,成功了以后即便再执行reject ('failed')状态也不会改变。

Promise是一个构造函数,自己身上有all、reject、resolve这几个的方法,原型上有then、catch等同样的方法。这么说用Promise new出来的对象肯定就有then、catch方法。

我们创建一个实例就可以使用这些方法了。

let Mypromise = new Promise(function(resolve,reject){
setTimeout(function(){
let a = 22;
let b = 20;
if(a>b){
// 如果走了resolve,则触发.then,把a+b的值传入.then
resolve(a+b);
}else{
// 如果走了reject,则触发.catch,输出err 'b>a'
reject('b>a');
}
},2000);
});
// 当b>a的时候,Mypromise.then这串代码不会被触发
Mypromise.then(function(value){
console.log('2s后');
console.log(value,'value');
// 如果 then 中返回的是一个 Promise 对象,那么下一个 then 将相当于对这个返回的 Promise 进行操作
// 记得如果还想继续给下一个.then传参数,就必须要return
return new Promise(function(resolve,reject){
setTimeout(function(){
let c = 41;
if(c<value){
// 如果走了resolve,则触发.then,把value-c的值传入.then
resolve(value-c);
}else{
// 如果走了reject,则触发.catch,输出err 'c>value'
reject('c>value');
}
},1000)
})
}).then(function(data){
console.log('1s后');
console.log(data,'data');
})
.catch(function(err){
console.log(err)
})

可以看到这串代码是当a>b的时候走的resolve,否则走reject,首先我们要知道,当触发resolve的时候就会去执行.then(),触发reject的时候就会执行.catch(),

a=22,b=20,所以a>b,走resolve,resolve传递了a+b的值给了.then,

也就是把42传递给了.then,这个时候执行了.then(),首先输出了value,也就是resolve传递下来的值,(注意这里的value可以随便取名),

然后.then()中有一个新的promise,如果 then 中返回的是一个 Promise 对象,那么下一个 then 将相当于对这个返回的 Promise 进行操作,

还有就是如果还想继续给下一个.then传参数,就必须要return,如果不return的话那么结果将会变为42和undifinded,

promise 不能返回值只能返回promise,因为它是异步的,要用就得 fn1().then(value => console.log(value)) 的方式拿到值,

所以到第二个promise的时候走了resolve,执行.then,第二个.then通过第一个.then,return把value-c的值传到了.then中输出了date,

如果我们把b改为25会怎样呢?

let Mypromise = new Promise(function(resolve,reject){
setTimeout(function(){
let a = 22;
let b = 25;//变成了25
if(a>b){
// 如果走了resolve,则触发.then,把a+b的值传入.then
resolve(a+b);
}else{
// 如果走了reject,则触发.catch,输出err 'b>a'
reject('b>a');
}
},2000);
});
// 当b>a的时候,Mypromise.then这串代码不会被触发
Mypromise.then(function(value){
console.log('2s后');
console.log(value,'value');
// 如果 then 中返回的是一个 Promise 对象,那么下一个 then 将相当于对这个返回的 Promise 进行操作
// 记得如果还想继续给下一个.then传参数,就必须要return
return new Promise(function(resolve,reject){
setTimeout(function(){
let c = 41;
if(c<value){
// 如果走了resolve,则触发.then,把value-c的值传入.then
resolve(value-c);
}else{
// 如果走了reject,则触发.catch,输出err 'c>value'
reject('c>value');
}
},1000)
})
}).then(function(data){
console.log('1s后');
console.log(data,'data');
})
.catch(function(err){
console.log(err)
})

把b改为25,b比a大所以走了reject,这时候就只输出了一个'b>a',

因为他没走resolve,所以自然不会触发.then,所以下面的代码块也不会执行。

纯属小白学习笔记,如果有不正确的,还望各位大佬指正!!!

promise初体验,小白也能看懂的更多相关文章

  1. 小白也能看懂的插件化DroidPlugin原理(二)-- 反射机制和Hook入门

    前言:在上一篇博文<小白也能看懂的插件化DroidPlugin原理(一)-- 动态代理>中详细介绍了 DroidPlugin 原理中涉及到的动态代理模式,看完上篇博文后你就会发现原来动态代 ...

  2. 小白也能看懂的插件化DroidPlugin原理(三)-- 如何拦截startActivity方法

    前言:在前两篇文章中分别介绍了动态代理.反射机制和Hook机制,如果对这些还不太了解的童鞋建议先去参考一下前两篇文章.经过了前面两篇文章的铺垫,终于可以玩点真刀实弹的了,本篇将会通过 Hook 掉 s ...

  3. 小白也能看懂的Redis教学基础篇——朋友面试被Skiplist跳跃表拦住了

    各位看官大大们,双节快乐 !!! 这是本系列博客的第二篇,主要讲的是Redis基础数据结构中ZSet(有序集合)底层实现之一的Skiplist跳跃表. 不知道那些是Redis基础数据结构的看官们,可以 ...

  4. 【vscode高级玩家】Visual Studio Code❤️安装教程(最新版🎉教程小白也能看懂!)

    目录 如果您在浏览过程中发现文章内容有误,请点此链接查看该文章的完整纯净版 下载 Linux Mac OS 安装 运行安装程序 同意使用协议 选择附加任务 准备安装 开始安装 安装完成 如果您在浏览过 ...

  5. 小白也能看懂的Redis教学基础篇——做一个时间窗限流就是这么简单

    不知道ZSet(有序集合)的看官们,可以翻阅我的上一篇文章: 小白也能看懂的REDIS教学基础篇--朋友面试被SKIPLIST跳跃表拦住了 书接上回,话说我朋友小A童鞋,终于面世通过加入了一家公司.这 ...

  6. 搭建分布式事务组件 seata 的Server 端和Client 端详解(小白都能看懂)

    一,server 端的存储模式为:Server 端 存 储 模 式 (store-mode) 支 持 三 种 : file: ( 默 认 ) 单 机 模 式 , 全 局 事 务 会 话 信 息 内 存 ...

  7. 小白也能看懂插件化DroidPlugin原理(一)-- 动态代理

    前言:插件化在Android开发中的优点不言而喻,也有很多文章介绍插件化的优势,所以在此不再赘述.前一阵子在项目中用到 DroidPlugin 插件框架 ,近期准备投入生产环境时出现了一些小问题,所以 ...

  8. 小白也能看懂的插件化DroidPlugin原理(一)-- 动态代理

    前言:插件化在Android开发中的优点不言而喻,也有很多文章介绍插件化的优势,所以在此不再赘述.前一阵子在项目中用到 DroidPlugin 插件框架 ,近期准备投入生产环境时出现了一些小问题,所以 ...

  9. 小白都能看懂的tcp三次握手

    众所周知,TCP在建立连接时需要经过三次握手.许多初学者经常对这个过程感到混乱:SYN是干什么的,怎么一会儿是1一会儿是0?怎么既有大写的ACK又有小写的ack?为什么ACK在第二次握手才开始出现?初 ...

随机推荐

  1. KNN分类

    1. KNN简介 K近邻(K-Nearest Neighbor)简称KNN.它可以做分类算法,也可以做回归算法.个人经验:KNN在做分类问题时非常有效. 2. KNN算法思想 在样本空间中,我们认为两 ...

  2. 深刨显式锁ReentrantLock原理及其与内置锁的区别,以及读写锁ReentrantReadWriteLock使用场景

    13.显示锁 在Java5.0之前,在协调对共享对象的访问时可以使用的机制只有synchronized和volatile.Java5.0增加了一种新的机制:ReentrantLock.与之前提到过的机 ...

  3. Docker从入门到精通(八)——Docker Compose

    恭喜大家,学到这里,对于 docker 的基础玩法大家应该都会了,下面会介绍 docker的一些编排工具. 1.为什么需要 Docker Compose? 官网镇楼:https://www.runoo ...

  4. python执行命令行调试工具pdb

    调试 pdb pdb是基于命令行的调试工具,非常类似gnu的gdb(调试c/c++). 命令 简写命令 作用 break b 设置断点(用法,b <数字>:在第数字行设置断点....... ...

  5. thinkphp 5 在页面输出当前时间

    我遇到的使用场景是<input>默认为当前时间,代码如下: <input name="starttime" id="starttime" ty ...

  6. Spring学习(三)几种集合属性的注入方式

    1.前言 众所周知.java中不只有八大简单类型.还有一些集合类型.本文围绕集合类型的注入做一个总结. 2.项目骨架 3.过程 1.创建实体类AllCollectionType package com ...

  7. iOS越狱插件源查找及避免插件劫持

    1.关于 iOS越狱插件源查找地址:https://www.ios-repo-updates.com/ 2.注意 不要使用不可靠的第三方源,其可能存在劫持,而你却茫然不知. 使用上面的网站查找你需要的 ...

  8. 【LeetCode】939. Minimum Area Rectangle 解题报告(Python & C++)

    作者: 负雪明烛 id: fuxuemingzhu 个人博客: http://fuxuemingzhu.cn/ 目录 题目描述 题目大意 解题方法 确定对角线,找另外两点(4sum) 字典保存出现的x ...

  9. 【LeetCode】761. Special Binary String 解题报告(Python)

    作者: 负雪明烛 id: fuxuemingzhu 个人博客: http://fuxuemingzhu.cn/ 题目地址: https://leetcode.com/problems/special- ...

  10. 【LeetCode】609. Find Duplicate File in System 解题报告(Python & C++)

    作者: 负雪明烛 id: fuxuemingzhu 个人博客: http://fuxuemingzhu.cn/ 目录 题目描述 题目大意 解题方法 日期 题目地址:https://leetcode.c ...