ES6新增的本地对象Promise(面试必问)

Promise用来优化回调地狱

文章目录

• • 回调地狱
  • Promise
  • • Promise的使用

回调地狱

1. 异步导致的多层回调函数嵌套，叫回调地狱
2. 回调地狱的缺点

• 极大的伤害了代码的可读性
• 消耗了大量的性能

3. 回调地狱解决了多层异步的执行状态

   • 异步请求：http://localhost:3000/api?type=a
   • 异步请求：http://localhost:3000/api?type=b
   • 异步请求：http://localhost:3000/api?type=c
   • 绝对获取到a，b，c的数据

   ajax("http://localhost:3000/api?type=a",function(){
       ajax("http://localhost:3000/api?type=b",function(){
           ajax("http://localhost:3000/api?type=c",function(){
               console.log(a,b,c)
           })
       })
   })
   

Promise

这个对象有三种状态：Pending（进行中）、Resolved（已完成，又称 Fulfilled）和 Rejected（已失败）。只有异步操作的结果，可以决定当前是哪一种状态，任何其他操作都无法改变这个状态。这也是 Promise 这个名字的由来，它的英语意思就是「承诺」，表示其他手段无法改变。

这个对象状态有一定顺序， 从 Pending 到Resolved 再到 Rejected 这个顺序不可逆;
1.进行中
2.成功 或 失败

Promise的使用

1.首先要实例化promise;

var p = new Promise()

2.实例化的时候，这个Promise对象接受一个函数参数,这个函数参数有两个参数: success 和 Failed;

var p = new Promise(function(success,Failed){})

3.然后在函数内部调用success 代表决定(成功);Failed 代表 失败;

var p = new Promise(function(success,Failed){
    //做一些异步操作
    setTimeout(function(){
       success("成功");
    }, Math.round(Math.random()*1000));

    setTimeout(function(){
       Failed("失败了");
    },500)
});

4.紧接着是 resolved的好兄弟then()

then 方法接受两个参数，两个参数都是函数，第一个函数成功调用，第二个函数失败时调用;

而且then函数会等待，什么时候promise对象状态改变了， 什么时候then执行;

p.then(function(value){

    console.log(value);  //成功时调用

},function(value){

    console.log(value); //失败时调用

})