人人周末好，要说近来几年什么言语大红大紫，当属JavaScript了。话说虽然是10天就创造出的言语，然则人家能文能武。web前端天然没必要多说了，种种框架你方登罢我上场，前两年照样Angular金瓯无缺，这两年React又是大红大紫，另有Vue近来异军突起，好不红火。假如仅仅是前端也就算了，然则由于Node.js人家在背景也能写，React Native的涌现让人家挪动端也能做。好吧，另有硬件上也涌现Ruff计划，彷佛硬件上也能写了。真是让人觉得挺有意义的事变。
图表君上边叨叨了这么多，岂非是为JavaScript唱赞歌的吗？呵呵，实在并非。只是近来由于在用上篇文章引见的AWS Lambda。Lambda如今只支撑Java，Node.js,Python。终究挑选了Node.js举行开辟，不可避免的要牵扯到异步操纵的题目。那末本日就来聊聊JavaScript中的Promise。
什么是Promise
Promise是异步编程的一种处理计划，比传统的处理计划——回调函数和事宜——更合理和更壮大。它由社区最早提出和完成，ES6将其写进了言语范例，一致了用法，原生供应了Promise对象。
所谓Promise，简朴说就是一个容器，内里保存着某个将来才会完毕的事宜（通常是一个异步操纵）的效果。从语法上说，Promise是一个对象，从它能够猎取异步操纵的音讯。Promise供应一致的API，种种异步操纵都能够用一样的要领举行处置惩罚。
上面是Promise的一个定义，引自阮一峰的ES6范例入门一书。S6范例入门。多说一句，现在的JavaScript项目无论是前台或许是背景，都应该采纳ES6的范例语法来写，ES6让JavaScript的誊写越发的清晰和范例。
基础用法
怎样来组织一个promise对象呢？ES6中供应了原生Promise能够运用。
var promise = new Promise(function(resolve, reject) {
// ... here is some code
if (/* 异步操纵胜利 */){
resolve(value);
} else {
reject(error);
}
});上面的例子给出了new一个promise对象的要领，Promise的组织函数接收一个函数作为参数传入，这个函数的两个参数，reject和resolve是JavaScript自身供应的两个函数。
一个promise对象有三个状况分别是，pending，resolved，rejected。resolve函数能够将pending状况转变为resolved状况。reject函数能够讲pending状况转变了rejected状况。对象的状况不受外界的影响，一样也是promise名字的由来。外部你拿着我的一个许诺，一会我会通知你我的状况。
promise对象经由过程then要领来添加回调函数。比方如许
promise.then(data=> console.log(data), err=> console.log(err));
当promise被resolved的时刻，就会把data log出来。当promise被rejected的时刻，err就会被log出来。
看上去彷佛是挺简朴的，确实Promise的运用使得异步的操纵，以同步的情势表现出来。当发作毛病的时刻能够经由过程catch要领，来定义回调函数。
怎样用
上边都是一些干巴巴的定义，那末究竟该怎样用呢？Promise又怎样的处理了题目呢，下边我们看一个例子。假定下边一个场景，我们一个效劳，从一个外边service猎取数据，然后写到一个db里，或许一个存储里，末了在把存储的状况龙出来，那末假如没有promise是怎样写的呢？能够会是如许。
getData(function (value1) {
storeToDb(value1, function(value2) {
logStore(value2, function(value3) {
//...
});
});
});传统的回调的写法，如许使得代码逻辑杂沓在一同。再想一想假如再加上毛病处置惩罚的状况，更是酸爽。那末用promise来写会怎样呢？看下边如许的代码
function getData(){
return new Promise((resolve,reject) =>{
// ... send request to get data
if(/* get successfully*/){
resolve(data)
}else{
reject(err)
}
})
}
function storeData(data){
return new Promise((resolve,reject)=>{
// ... store the data
if(/*store successfully*/){
resolve(data)
}else{
reject(err)
}
})
}
getData()
.then(data => storeData(data))
.then(data => console.log('the process is done',data));
.catch(err => console.error('there is the err',err));
如许写是否是就是很清晰了，先getData，然后再storeData，末了将此次运转的状况log了出来，其中有任何的题目，在catch中都能够Catch出来。代码的逻辑以同步的体式格局获得了表现。我们来看看假如是其他言语会怎样写，下边是个ruby的言语的例子
def get_data
// ...send request
if /*get successfully */
return data
else
raise GetDataError
end
end
def store_data
// ...save to db
if /*save successfully */
return data
else
raise StoreDataError
end
end
/*Main Logic*/
begin
request_data = get_data
db_data = store_data request_data
p "here is the store data #{db_data}"
rescue e
p "here is some errors #{e}"
end我们对照两个例子，能够看到在运用的Promise后让JavaScript的异步体式格局的编程形式更将清晰，也越发让人轻易明白。
由于JavaScript的实行环境是单线程的，所以大批采纳了异步的体式格局来举行编程，这使得我们写起代码并不非常相符我们平常的习气。然则Promise的涌现让这类题目能获得肯定水平的减缓。
然则异步操纵异步操纵的优点，比方上边的谁人例子，假如我们想要做的同时并发10个操纵，谁人在ruby或许其他言语中中就要启多个线程来举行。然则JavaScript就完整没有这个题目。只需简朴的loop下就好了。
然则假如我们想要在这10个操纵完成后依据返回的状况做点其他操纵该怎样做呢？这时刻用Promise.all就是最好的了。
let p = Promise.all([p1, p2, p3]);
Promise.all接收数组作为参数传入，每一个元素都是一个promise对象。只需一切子promise都resolved今后，p才会被resolved。只需有一个被rejected，这个p就会被rejected。然则有一点是这些子promise之间并不会有递次的关联。再来看一个例子：
var guid = 0;
function run() {
guid++;
var id = guid;
return new Promise(resolve => {
setTimeout(function () {
console.log(id);
resolve(id);
}, (Math.random() * 1.5 | 0) * 1000);
});
}
var promises = Array.from({ length: 10 }, run);
Promise.all(promises)OUTPUT:
2
3
5
6
7
8
10
1
4
9从此次的output能够看到，promise之间并没有递次实行，实际上是并发的。那末怎样让这些promise是递次实行呢？留个人人本身思索下，下篇文章，我们发表。或许能够联络图表君，私自通知你答案哦。
ps，固然也能够用一些第三方的库和计划，比方（async）来完成递次操纵，然则代码的兴趣不就是做些头脑应战吗:)
原创文章，迎接转发，但请标明出处。迎接关注图表君的民众号，一同生长。在微信中搜刮 “多彩数据” 或许 “Data_Visualization”
