new Promise使用

一、Promise.all

let arr = ['a', 'b', 'c', 'd']
let list = []
for (let index = 0; index < arr.length; index++) {
    const element = arr[index];
    var currentData = new Promise(function (resolve, reject) {
        // 当异步代码执行成功时，我们才会调用resolve(...), 当异步代码失败时就会调用reject(...)
        // 在本例中，我们使用setTimeout(...)来模拟异步代码，实际编码时可能是XHR请求或是HTML5的一些API方法.
        // 正常情况下是用数组中每个参数传递给异步请求的接口中
        setTimeout(function () {
            resolve(element); // 代码正常执行！
            // reject('失败')
        }, 250);
    });
    list.push(currentData)
}
let resData = []
Promise.all(list).then((vals)=> {
    console.log(vals)
    resData = vals.map((item, i)=> {
        return {
            index: i,
            ...item
        }
    })
    console.log(resData)
}).catch(err=> {
    // 失败时返回
    console.log(err)
})

二、promise.then

// 第一步：model层的接口封装
const promise = new Promise((resolve, reject) => {
    // 这里做异步任务（比如ajax 请求接口。这里暂时用定时器代替）
    setTimeout(function() {
        var data = { retCode: 0, msg: 'qianguyihao' }; // 接口返回的数据
        if (data.retCode == 0) {
            // 接口请求成功时调用
            resolve(data);
        } else {
            // 接口请求失败时调用
            reject({ retCode: -1, msg: 'network error' });
        }
    }, 100);
});

// 第二步：业务层的接口调用。这里的 data 就是 从 resolve 和 reject 传过来的，也就是从接口拿到的数据
promise.then(data => {
    // 从 resolve 获取正常结果
    console.log(data);
}).catch(data => {
    // 从 reject 获取异常结果
    console.log(data);
});