ES6新特性_Promise介绍与基本使用

Promise 三种状态

Pending（进行中，初始状态，既不是成功，也不是失败状态。）、Resolved（已完成，又称 Fulfilled）、Rejected（已失败）

1. 这三种状态的变化途径只有2种：
2. 异步操作从 未完成 pending => 已完成 resolved
3. 异步操作从 未完成 pending => 失败 rejected
4. 状态一旦改变，就无法再次改变状态，这也是它名字 promise-承诺 的由来，一个promise对象只能改变一次

Pending 状态的 Promise 对象可能会变为fulfilled 状态并传递一个值给相应的状态处理方法，也可能变为失败状态（rejected）并传递失败信息。当其中任一种情况出现时，Promise 对象的 then 方法绑定的处理方法（handlers ）就会被调用（then方法包含两个参数：onfulfilled 和 onrejected，它们都是 Function 类型。当Promise状态为fulfilled时，调用 then 的 onfulfilled 方法，当Promise状态为rejected时，调用 then 的 onrejected 方法， 所以在异步操作的完成和绑定处理方法之间不存在竞争）。

因为 Promise.prototype.then 和 Promise.prototype.catch 方法返回promise 对象， 所以它们可以被链式调用。

基本使用

// 实例化 Promise 对象
const p = new Promise((resolve, reject)=>{
    // 异步请求
    $.ajax({
        url: "http://xxxxx.com/v1/posts",
        type: "get",
        success: function(res){
            // 请求数据成功,调用resolve来改变Promise的状态为成功
            resolve(res.data)
        },error: function(err){
            // 请求数据失败,调用reject来改变Promise的状态为失败
            reject(err)
        }
    });
});

// 调用 Promise 的 then 方法接收状态
p.then(
    res=>{ console.log(res); }, // 成功
    err=>{ console.error(err); } // 失败
);

Nodejs, 小程序，vue, angular...都会用到异步请求, 一般写法

const fs = require("fs");
fs.readFile("resources/text.txt",(err,data1)=>{
    fs.readFile("resources/test1.txt",(err,data2)=>{
        fs.readFile("resources/test2.txt",(err,data3)=>{
            let result = data1 + data2 + data3;
            console.log(result);
        });
    });
});

使用 Promise 实现， 这种方式代码就不会层层嵌套

// 创建Promise实例
const p = new Promise((resolve,reject)=>{
    fs.readFile("resources/text.txt",(err,data)=>{
        resolve(data);
    });
});

// 使用Promise的then方法链式调用
p.then(value=>{
    // 这里返回的是Promise,那外层就可以继续调用then来获取结果
    return new Promise((resolve,reject)=>{
        fs.readFile("resources/test1.txt",(err,data)=>{
            resolve([value,data]);
        }); 
    })
}).then(value=>{
    // 这里返回的是Promise,那外层就可以继续调用then来获取结果
    return new Promise((resolve,reject)=>{
        fs.readFile("resources/test2.txt",(err,data)=>{
            value.push(data);
            resolve(value);
        });
    }) 
}).then(value=>{
    // 这里就可以获取到三次请求的结果，
    console.log(value.join("\r\n"));
})

catch

Promise中使用reject时，才会触发catch方法与then方法的第二个回调函数类似

p.catch((err)=>{
    console.log(err)
});