Promise可以进行异步操作,比起回调函数,更加容易维护。

首先创建一个简单的Promise

var p = new Promise( () => {});

console.log(p);  //会打印一个promise对象,状态是pending,状态值是undefined

如果Promise构造函数里没有参数将会报错

promise有三个状态,分别是pending,resolved和rejected。

var p = new Promise((res,rej) => { //里面有俩个参数,是俩个函数,一个表示成功的,一个表示失败的
res(200);
}) console.log(p); //打印promise对象,状态是成功,状态值是200

promise任务链

var p = new Promise((res,rej) => { res() }); //promise链式,可以一直then,如果有一次状态为失败,就会执行catch
p.then(() => {
console.log(1);
}).then(() => { //then本身是返回一个promise,也可以自己return一个新的promise实例
return new Promise((res,rej) => {
rej(100);
})
}).then(() => {
console.log(3)
}).catch((data) => {
console.log(data);
)};

打印的是1和100,p拥有一个then方法,并且他还会返回一个promise,可以进行链式操作,如果中途有个rejected状态,就会执行catch,并且后面的不在执行

执行顺序

console.log(1);  

setTimeout(() => {
console.log(2);
}) setTimeout(()=> {
console.log(3);
}) var p = new Promise((res,rej) => {
console.log(4);
res();
})
p.then(()=>{
console.log(5)
}) console.log(6);

打印的顺序是1,4,6,5,2,3

js从上到下执行,第一个打印1,后面有俩个定时器,还有直接打印的和promise,定时器有延迟执行,会放到队列里,promise创建的时候回里面执行参数里面的代码,就会打印4

然后打印6,之后会打印5,最后会打印队列里的俩个定时器2,3

宏任务 : 主体js,setTimeout(setTimeout里面的函数是异步的),setInterval;
微任务 : Promise后面的then和catch,process.nextTick

promise的静态方法

var p1 = new Promise((res,rej) => {
setTimeout(() => {
res('1');
},1000)
}) var p2 = new Promise((res,rej) => {
setTimeout(() => {
res('2');
},2000)
}) var p3 = new Promise((res,rej) => {
setTimeout(() => {
res('3')
},500)
}) var p4 = Promise.all([p1,p2,p3]); p4.then((data) => {
console.log(data); //['1','2','3']
}) console.log(p4); //打印一个promise对象

Promise.all()他可以让参数里面的所有promise最后同时进行

并且还有rece方法,他会执行里面最快的一个promise

Promise使用的更多相关文章

  1. Javascript - Promise学习笔记

    最近工作轻松了点,想起了以前总是看到的一个单词promise,于是耐心下来学习了一下.   一:Promise是什么?为什么会有这个东西? 首先说明,Promise是为了解决javascript异步编 ...

  2. 路由的Resolve机制(需要了解promise)

    angular的resovle机制,实际上是应用了promise,在进入特定的路由之前给我们一个做预处理的机会 1.在进入这个路由之前先懒加载对应的 .js $stateProvider .state ...

  3. angular2系列教程(七)Injectable、Promise、Interface、使用服务

    今天我们要讲的ng2的service这个概念,和ng1一样,service通常用于发送http请求,但其实你可以在里面封装任何你想封装的方法,有时候控制器之间的通讯也是依靠service来完成的,让我 ...

  4. 闲话Promise机制

    Promise的诞生与Javascript中异步编程息息相关,js中异步编程主要指的是setTimout/setInterval.DOM事件机制.ajax,通过传入回调函数实现控制反转.异步编程为js ...

  5. 深入理解jQuery、Angular、node中的Promise

    最初遇到Promise是在jQuery中,在jQuery1.5版本中引入了Deferred Object,这个异步队列模块用于实现异步任务和回调函数的解耦.为ajax模块.队列模块.ready事件提供 ...

  6. Promise的前世今生和妙用技巧

    浏览器事件模型和回调机制 JavaScript作为单线程运行于浏览器之中,这是每本JavaScript教科书中都会被提到的.同时出于对UI线程操作的安全性考虑,JavaScript和UI线程也处于同一 ...

  7. JavaScript进阶之路——认识和使用Promise,重构你的Js代码

    一转眼,这2015年上半年就过去了,差不多一个月没有写博客了,"罪过罪过"啊~~.进入了七月份,也就意味着我们上半年苦逼的单身生活结束了,从此刻起,我们要打起十二分的精神,开始下半 ...

  8. 细说Promise

    一.前言 JavaScript是单线程的,固,一次只能执行一个任务,当有一个任务耗时很长时,后面的任务就必须等待.那么,有什么办法,可以解决这类问题呢?(抛开WebWorker不谈),那就是让代码异步 ...

  9. 浅谈Angular的 $q, defer, promise

    浅谈Angular的 $q, defer, promise 时间 2016-01-13 00:28:00  博客园-原创精华区 原文  http://www.cnblogs.com/big-snow/ ...

  10. angular学习笔记(二十八-附2)-$http,$resource中的promise对象

    下面这种promise的用法,我从第一篇$http笔记到$resource笔记中,一直都有用到: HttpREST.factory('cardResource',function($resource) ...

随机推荐

  1. PAT甲级1143 Lowest Common Ancestor【BST】

    题目:https://pintia.cn/problem-sets/994805342720868352/problems/994805343727501312 题意: 给定一个二叉搜索树,以及他的前 ...

  2. PowerPoint使用技巧

    1.右键Group两个元素,可以一起移动: 2.Insert 屏幕输入功能: 3.录制旁白: 4.录制完旁白之后可以生成视频: 5.如果不确定所有引用的组件是否可以在别的机器上使用,可以导出只CD,生 ...

  3. 12.0-uC/OS-III任务调度

    调度器,决定了任务的运行顺序. uC/OS-III是一个可抢占的, 基于优先级的内核.根据其重要性每个任务都被分配了一个优先级.uC/OS-III支持多个任务拥有相同的优先级. 1.抢占式调度 uC/ ...

  4. [js]js设计模式-工厂模式

    // 定义一个人 var p1 = { name: 'wxb', age: 22, writejs: function () { console.log(this.name + ' can sing. ...

  5. InternalError (see above for traceback): Blas GEMM launch failed

    训练BiLSTM模型的时候报错: InternalError (see above for traceback): Blas GEMM launch failed : a.shape=(32, 200 ...

  6. vmvare安装vmtools菜单灰色

    光驱和各种驱动器改为自动检测 将vmvaretools.gz文件解压 tar xvf vm...gz 然后进程解压目录运行 sudo ./vmware-install.pl 然后重启 reboot 这 ...

  7. es6阮一峰读后感

    不经意间看了你一眼(阮一峰的es6读后感)我自己常用的 字符串篇:ES6 为字符串添加了遍历器接口(详见<Iterator>一章),使得字符串可以被for...of循环遍历.只要有遍历器接 ...

  8. db2常见错误代码及原因

    sqlcode sqlstate 说明000 00000 SQL语句成功完成01xxx SQL语句成功完成,但是有警告+012 01545 未限定的列名被解释为一个有相互关系的引用+098 01568 ...

  9. input 输入速度和方向判断、搜索功能的延迟请求

    1.input 输入速度和方向判断 var wxApp = {} wxApp.click = function (str,speed) { var lastInput = { d: "&qu ...

  10. JavaScript 神奇的参数

    JS函数的参数,和其他语言区别非常大.它不在乎你传过来多少个参数,也不在乎传过来的参数是什么类型.即使你定义的函数只接受两个参数,你调用这个函数的时候可以传递一个.三个甚至不传参数.这是因为JavaS ...