ES6系列八:Promise

异步和同步
 异步,操作之间没有关系,同时执行多个操作, 代码复杂。
 同步,同时只能做一件事,代码简单。
Promise 对象
 用同步的方式来书写异步代码。
 Promise 让异步操作写起来,像在写同步操作的流程,不必一层层地嵌套回调函数。
 改善了可读性,对于多层嵌套的回调函数很方便。
 充当异步操作与回调函数之间的中介,使得异步操作具备同步操作的接口。
Promise 也是一个构造函数
 接受一个回调函数f1作为参数,f1里面是异步操作的代码。
 返回的p1就是一个 Promise 实例。
 所有异步任务都返回一个 Promise 实例。
 Promise 实例有一个then方法,用来指定下一步的回调函数。

function f1(resolve, reject) {
  // 异步代码...
}
var p1 = new Promise(f1);
p1.then(f2); // f1的异步操作执行完成,就会执行f2。

Promise 使得异步流程可以写成同步流程

// 传统写法
step1(function (value1) {
  step2(value1, function(value2) {
    step3(value2, function(value3) {
      step4(value3, function(value4) {
        // ...
      });
    });
  });
});

// Promise 的写法
(new Promise(step1))
  .then(step2)
  .then(step3)
  .then(step4);
let p=new Promise(function (resolve, reject) {
    //异步代码
    //resolve成功。reject失败
    $.ajax({
        url: 'data/arr',
        dataType: 'json',
        success(arr){
            resolve(arr);
        },
        error(err){
            reject(err);
        }
    })
});

p.then(function (arr) {
    alert('成功'+arr);
},function (err) {
    console.log(err);
    alert('失败'+err);
});
let p1=new Promise(function (resolve, reject) {
$.ajax({
        url: 'data/arr',
        dataType: 'json',
        success(arr){
            resolve(arr);
        },
        error(err){
            reject(err);
        }
    })
});

let p2=new Promise(function (resolve, reject) {
    $.ajax({
        url: 'data/json',
        dataType: 'json',
        success(arr){
            resolve(arr);
        },
        error(err){
            reject(err);
        }
    })
});

Promise.all([
    p1,p2
]).then(function (arr) {
    let [res1,res2]=arr;
    alert('全都成功了');
    alert(res1);
    alert(res2);
},function () {
    alert('至少有一个失败了');
});
function createPromise(url){
    return new Promise(function (resolve, reject) {
        $.ajax({
            url,
            dataType: 'json',
            success(arr){
                resolve(arr);
            },
            error(err){
                reject(err);
            }
        })
    });
}

Promise.all([
    createPromise('data/arr'),
    createPromise('data/json')
]).then(function (arr) {
    let [res1,res2]=arr;
    alert('全都成功了');
    alert(res1);
    alert(res2);
},function () {
    alert('至少有一个失败了');
});
Promise.all([
    $.ajax({url:'data/arr', dataType: 'json'}),
    $.ajax({url:'data/json', dataType: 'json'})
]).then(function (results) {
    let [arr,json]=results;
    alert('成功了');
    console.log(arr,json);
},function () {
    alert('失败了');
});
Promise.all([
    $.ajax({url:'data/arr', dataType: 'json'}),
    $.ajax({url:'data/json', dataType: 'json'}),
    $.ajax({url:'data/num', dataType: 'json'})
]).then(results=>{
    let [arr,json,num]=results;

    alert('成功了');
    console.log(arr,json,num);
},err=>{
    alert('失败了');
});

Promise.all(promiseArray)方法: 都成功才算成功
 将多个Promise对象实例包装,生成并返回一个新的Promise实例。
 promise数组中所有的promise实例都变为resolve的时候,该方法才会返回。
 并将所有结果传递results数组中。
 promise数组中任何一个promise为reject的话,则整个Promise.all调用会立即终止,并返回一个reject的新的promise对象。

var p1 = Promise.resolve(1),
    p2 = Promise.resolve(2),
    p3 = Promise.resolve(3);
Promise.all([p1, p2, p3]).then(function (results) {
    console.log(results);  //[1, 2, 3]
});

Promise.race([p1, p2, p3])方法:有一个成功就算成功
 Promse.race就是赛跑的意思
 哪个结果获得的快,就返回那个结果
 不管结果本身是成功状态还是失败状态

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

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

余额充值