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);
});
  • 3
    点赞
  • 10
    收藏
    觉得还不错? 一键收藏
  • 打赏
    打赏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

7cccccc

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值