文档章节

js es6的Promise

别人说我名字很长
 别人说我名字很长
发布于 2016/11/22 23:21
字数 803
阅读 39
收藏 1

js es6支持了原生的Promise支持了,以后异步不用再去找promise库了,下面看看Promise对象的使用方法

1、直接var p =new Promise(function(resolver,reject){.....你要进行的异步过程.....}) 就可以返回一个Promise对象,

2、上面实例化Promise对象时需要给Promise传入一个函数,这个函数有两个回调函数 resolver成功回调函数和reject失败回调函数

3、在promise的构造函数里面写你要处理的异步过程,异步执行得到的成功结果给resolve(result),失败结果给reject(result)

4、实例化后的Promise对象句柄d有一个方法then(callback1,callback2),有两个函数参数,成功回调函数resolve(result)和失败回调函数reject(result)。这样写:d.then(function(data){...异步执行成功后的过程...},function(data){...异步执行失败后的过程...})

下面看个例子加深印象

// 实例化一个Promise对象
var p = new Promise(function(resolver,reject){
    setTimeout(function(){ // 需要执行异步的操作的代码
         console.log("................");
         if(5>9){
             resolver({id:9}); // 成功返回的回调函数
         }else{
             reject({msg:"error"}); //失败返回的回调函数
         }         
    },3000);
});

//开始执行异步操作,then方法第一个参数是成功回调函数,第二个参数是失败回调函数
p.then(function(data){
   console.log(data);
},function(data){
    console.log(data);
})

5、当你需要串行执行几个异步时,你可以使用链式调用的方法,每个then都可以返回一个Promise对象,请看例子,思考一下串行Promise

var p1 = new Promise(function (resolve,reject) {
	console.log("p1 start");
    setTimeout(function () {
        resolve("p1执行成功");
    }, 1000);
});

var p2 = function(res){
	console.log("p2 start");
	return new Promise(function (resolve,reject) {
	    setTimeout(function () {
	        reject(res+"\np2执行失败");
	    }, 1000);
	});
}


var p3 = function(res){
	console.log("p3 start");
	return new Promise(function (resolve,reject) {
	    setTimeout(function () {
	        resolve(res+"\np3执行成功");
	    }, 1000);
	});	
} 


var p4 = function(res){
	console.log("p3 start");
	return new Promise(function (resolve,reject) {
	    setTimeout(function () {
	        reject(res+"\np4执行失败");
	    }, 1000);
	});	
} 


var p5 = function(res){
	console.log("p4 start")
	return new Promise(function (resolve,reject) {
	    setTimeout(function () {
	        resolve(res+"\np5执行成功");
	    }, 1000);
	});
}

var err = function(res){
	return res; //串行时遇到一个失败回调后,以后串行全部进入失败回调
}

p1.then(p2,err).then(p3,err).then(p4,err).then(p5,err).then(function (result) {
    console.log(result); 
},function(result){
	console.log(result);
});

6、当你需要几个异步都执行完了之后再进行下一步时,Promise对象为我们提供了一个.all([p1,p1])方法,具体看代码

var p1 = new Promise(function (resolve) {
    setTimeout(function () {
        resolve("Hello");
    }, 3000);
});

var p2 = new Promise(function (resolve) {
    setTimeout(function () {
        resolve("World");
    }, 1000);
});

Promise.all([p1, p2]).then(function (result) {
    console.log(result); // ["Hello", "World"]
});


7、有些时候,多个异步任务是为了容错。比如,同时向两个URL读取用户的个人信息,只需要获得先返回的结果即可。这种情况下,用Promise.race()实现:

var p1 = new Promise(function (resolve) {
    setTimeout(function () {
        resolve("Hello");
    }, 3000);
});

var p2 = new Promise(function (resolve) {
    setTimeout(function () {
        resolve("World");
    }, 1000);
});

Promise.race([p1, p2]).then(function (result) {
    console.log(result); // "World" 由于p1执行较快,Promise的then()将获得结果'World'。p2仍在继续执行,但执行结果将被丢弃。
});

推荐一篇很感性的认识Promise的博文 点这里 

廖雪峰的官方网站 Promise介绍 点这里

© 著作权归作者所有

别人说我名字很长
粉丝 58
博文 265
码字总数 113728
作品 0
济南
程序员
私信 提问
ES6 Promise 执行解析

作为一门单线程的语言,刚学习 JavaScript 语言的时候,我曾怀疑过 JavaScript 在处理 ajax 数据请求,文件解析等过程效率会很低,而且在执行这些任务较大的代码中,会严重阻塞后面代码的执行...

sandy_anqi
03/04
0
0
JavaScript Promises 学习笔记

本文是 ECMAScript 2015 原生异步方法 Promise 的学习笔记。网上课程由 Udacity + Google 提供,老师是卡梅伦·皮特曼(Cameron Pittman)。 学习笔记分为 8 个部分: callbacks vs thens P...

HongyangWang
2017/04/23
0
0
探索Javascript异步编程

笔者在之前的一片博客中简单的讨论了Python和Javascript的异同,其实作为一种编程语言Javascript的异步编程是一个非常值得讨论的有趣话题。 JavaScript 异步编程简介 回调函数和异步执行 所谓...

naughty
2014/05/22
4.3K
8
异步 JavaScript - 事件循环

简评:如果你对 JavaScript 异步的原理感兴趣,这里有一篇不错的介绍。 在介绍 JavaScript 异步执行之前先来了解一下, JavaScript 同步代码是如何执行的。 这里有两个概念需要了解: 执行上...

极光推送
2018/12/05
11
0
JavaScript引擎是如何工作的?从调用栈到Promise你需要知道的一切

翻译:疯狂的技术宅 原文:www.valentinog.com/blog/engine… 从Call Stack,Global Memory,Event Loop,Callback Queue到 Promises 和 Async/Await 的 JavaScript引擎之旅! 你有没有想过浏...

前端先锋
05/20
0
0

没有更多内容

加载失败,请刷新页面

加载更多

只需一步,在Spring Boot中统一Restful API返回值格式与统一处理异常

统一返回值 在前后端分离大行其道的今天,有一个统一的返回值格式不仅能使我们的接口看起来更漂亮,而且还可以使前端可以统一处理很多东西,避免很多问题的产生。 比较通用的返回值格式如下:...

晓月寒丶
昨天
59
0
区块链应用到供应链上的好处和实际案例

区块链可以解决供应链中的很多问题,例如记录以及追踪产品。那么使用区块链应用到各产品供应链上到底有什么好处?猎头悬赏平台解优人才网小编给大家做个简单的分享: 使用区块链的最突出的优...

猎头悬赏平台
昨天
28
0
全世界到底有多少软件开发人员?

埃文斯数据公司(Evans Data Corporation) 2019 最新的统计数据(原文)显示,2018 年全球共有 2300 万软件开发人员,预计到 2019 年底这个数字将达到 2640万,到 2023 年达到 2770万。 而来自...

红薯
昨天
65
0
Go 语言基础—— 通道(channel)

通过通信来共享内存(Java是通过共享内存来通信的) 定义 func service() string {time.Sleep(time.Millisecond * 50)return "Done"}func AsyncService() chan string {retCh := mak......

刘一草
昨天
58
0
Apache Flink 零基础入门(一):基础概念解析

Apache Flink 的定义、架构及原理 Apache Flink 是一个分布式大数据处理引擎,可对有限数据流和无限数据流进行有状态或无状态的计算,能够部署在各种集群环境,对各种规模大小的数据进行快速...

Vincent-Duan
昨天
60
0

没有更多内容

加载失败,请刷新页面

加载更多

返回顶部
顶部