《你不知道的JavaScript》：深入理解Promise机制
《你不知道的JavaScript》：深入理解Promise机制
promise篇章1
本篇开始回顾下ES6中的Promise。注意是回顾，如果想从基础看promise的话，推荐看阮一峰大神的ES6入门中的promise章节。
在这个API面世之前，js开发者写异步代码主要用的是“回调函数”。但回调地狱什么的，想必有过经历都懂，难写难看难维护，真是不想看第二眼。所以Promise出来后备受欢迎。
当我下决心并把Promise真正弄懂之后，恨不得抱着Promise亲两口，把垃圾的回调一脚踢到天涯海角去，唔，那种心情想必有过经历的也懂，哈哈~~~
在开始看Promise代码之前，先拿一个实际生活案例来对Promise运行机制有个初步印象：
和妹子去餐厅吃牛排，找到位子坐下来后第一件事就是拿菜单点单，唔，这个这个那个一顿乱戳，选好菜品呼叫服务生确认菜单，服务生确认后去开单然后把菜品账单拿回来给你，告知20分钟内所有菜品将上齐，请耐心等待。点菜就是一个请求的过程，菜品账单就是一个承诺，保证最终会得到那些菜。所以得保存好菜品账单，这代表未来的菜品，所以此时无需担心。在等菜的过程中你可以和妹子在位子上讲话增进感情了。你对那些菜已经抱有想象，味道咋样？妹子喜不喜欢吃？价钱划不划算？菜虽然还上来但你已有这些想法，依据是大脑已经把菜品账单当作菜品的占位符，从本质上讲，这个占位符使得值不再依赖时间，这是一个未来值。终于服务生上菜了，上完菜就是一个承诺值完成的过程。当然也有可能会出现另一种情况，服务生抱歉的告诉你某样菜没有了，此时除了失望、愤怒，但还应看到未来值的另一个重要特性：它可能成功，也可能失败。
基于上例理解，Promise就是一个未来值承诺会执行的过程，不管这个未来值是成功还是失败。
下面给出Primise的一个使用实例。
1function add(xPromise, yPromise) {
2 // Promise.call([..])接收一个promise数组并返回一个新的promise
3 // 这个返回的新promise等待数组中的所有promise完成
4 return Promise.all([xPromise, yPromise])
5}
6
7var xPromise = function () {
8 return new Promise(function (resolve, reject) {
9 var str = "hello";
10 setTimeout(function () {
11 if(str){
12 resolve(str);
13 }else {
14 reject("str is undefined.");
15 }
16 }, 1000)
17 })
18 .then(function (res) {
19 return res;
20 })
21 .catch(function (err) {
22 console.log(err);
23 })
24}
25
26var yPromise = function () {
27 return new Promise(function (resolve, reject) {
28 var str = "world";
29 setTimeout(function () {
30 if(str){
31 resolve(str);
32 }else {
33 reject("str is undefined.");
34 }
35 }, 2000)
36 })
37 .then(function (res) {
38 return res;
39 })
40 .catch(function (err) {
41 console.log(err);
42 })
43}
44
45// xPromise()和yPromise()返回相应值的promise，可能已经就绪，也可能以后就绪
46add( xPromise(), yPromise() )
47// add函数返回的promise决议后，取得收到的x值和y值加在一起
48.then(function (valArr) {
49 console.log(valArr);
50 return valArr[0] + " " + valArr[1];
51})
52// 得到一个两个数组的和的promise，继续链式调用then()来等待返回新的promise
53.then(function (sum) {
54 console.log(sum);
55})xPromise()和yPromise()是直接调用的，它们的返回值(是promise)被传给add()，第二层是add()，通过Promise.all([..])创建并返回的promise，通过调用then()来等待这个promise。
就像上面的点菜案例一样，Promise决议的结果可能是完成也可能是拒绝。拒绝值和完成的Promise不一样：完成值总是编程给出，而拒绝值，也叫拒绝原因(reject reason)则可能是程序逻辑直接设置的，也可能是从运行异常隐式得出的值。
通过Promise，调用then()实际上可以接收两个函数参数，第一个是用于完成情况，第二个是用于拒绝情况：
1add( xPromise(), yPromise() )
2.then(
3 //完成处理函数
4 function (sum) {
5 console.log(sum);
6 },
7 //拒绝处理函数
8 function (err) {
9 console.log(err);
10 },
11)但通常的写法是把拒绝原因写在最后统一的catch中，而不写在then()里面。
关于promise有一个设计中最基础也是最重要的因素，promise决议后就是外部不可变的值，可以安全的把这个值传递给第三方，并确信它不会被有意无意的修改。
promise是一种封装和组合未来值的易于复用的机制。