如何理解ES6--Promise对象

Promise对象

JavaScript的世界中，所有代码都是单线程执行的。
由于这个“缺陷”，导致JavaScript的所有网络操作，浏览器事件，都必须是异步执行

function callback() {
    console.log('Done');
}
console.log('before timeout');
setTimeout(callback, 1000);
console.log('after timeout');

//依次输出：before timeout , after timeout , Done
异步操作会在某个时间点触发一个函数调用

这就是所谓的单线程，所有的任务需要“排队”，前一个执行完后才能执行下一个任务！

Promise对象的特点：

• 对象状态不受外界的影响，有三种状态：Pending, Resolved, Rejected. 异步操作的结果决定当前是哪一种状态，其他操作无法改变这个状态
• 一旦状态改变就不会再变。Promise对象的状态改变只有两种：从Pending变为Resloved 和 从Pending变为Rejected

          通过Promise对象可以异步操作以同步操作的流程表达出来，解决地狱回调的难题。什么是地狱回调，例如我们在写ajax的时候：我们要发送多个请求，而最后的那个请求的查询参数需要从前面的请求获得，也许由于网速原因，我们不知道前面的请求什么时候完成或者是否完成，你也可以用层层嵌套的回到函数来解决这个问题，但是Promise更友好！

基本语法

Promise是一个构造函数，用来生成Promise实例

var promise = new Promise(function(resolve, reject) {
    //...do something
    if(/*成功*/) {
        resolve(value);     //成功时调用，并将异步操作的结果作为参数传递出去
    } else {
        reject(error);      //失败时调用，并将异步操作报出的错误行为作为参数传递出去
    }
});

一旦新建一个promise就会立即执行！

var promise = new Promise(function(resolve, reject) {
    
});

function promise() {
    return new Promise(function(resolve, reject) {
        
    });
}

Promise构造函数接收一个函数作为参数，这个函数也接收两个函数作为参数：resolve 和 reject

function helloWorld(reday) {
    return new Promise(function(resolve, rejcet) {
        if(ready) {
            resolve('hello world !');
        } else {
            rejcet('good bye');
        }
    });
}
helloWorld(true).then(function(message) {
    alert(message);     //输出 hello world ，then方法的第一个参数就相当于resolve！
}, function() {
    alert(error);   
});

异步加载图片

function loadimg(url) {
    return new Promise(function(resolve, reject) {
        var img = new Image();
        img.onload = function() {
            resolve(img);
        };
        img.onerror = function() {
            reject(new.Error('Wrong at' + url));
        }
        img.src = url;
    });
}

then()和catch()

实例生成后，then方法分别指定resolved状态(即resolve)和rejected（即reject）状态的回调函数，then方法返回一个新的Promise实例。

       可以依次指定多个then()方法，第一个then()方法的回调函数执行后，可以将返回结果作为参数传入第二个then()方法的回调函数，依次类推

catch方法相当于then(null, rejection)，用于指定发生错误时的回调函数

promise.then(value => console.log('resolved:', value))
.catch(err => console.log('rejected:', err))

如果Promise状态已经变成resolved，再抛出错误是无效的

var promise = new Promise(function(resolve, reject) {
    resolve('ok'); 
    throw new Error('test');
});
promise
.then(function(val){console.log(val)})
.catch(function(err){console.log(err) });       // 控制台输出hello，不会抛出错误！

promise对象的错误具有冒泡性质，会一直向后传递，直到捕获为止

Promise.all() 和 Promise.race() 和 Promise.race()

Promise.all() 和 Promise.race()方法用于将多个Promise实例包装成一个新的Promise实例

var promise = Promise.all([p1, p2, p3]);
//接收的参数不一定是数组，但一定要具有Iterator接口，且返回的每个成员都必须是Promise实例

对于调用Promise.all()方法的Promise对象来说，其状态由所有参数成员的状态决定，传递给回调函数的值也是如此；而调用Promise.race()方法，其对象的状态由参数实例中率先改变状态的实例决定，哪个实例率先改变状态，Promise对象就跟着改变状态，并且把率先改变状态的实例返回的值传递给回调函数。

转载于:https://www.cnblogs.com/lugefan/p/7345804.html