学习Promise框架（一）

学习Promise框架（一）

Promise是什么

1. 抽象表达

   Promise是JS中进行异步编程的新的解决方案

2. 具体表达

   • 语法：Promise是个构造函数
   • 功能：Promise对象用来封装一个异步操作并可以获取其结果

3. promise的状态改变

   • pending变为resolved
   • pending变为rejected

   Promise只有这两种状态，且每个Promise只能改变一次

   成功的数据成为value，失败的数据称为reason

4. Promise的运行流程
   

为什么要用Promise

1. 纯回调的方式--------在异步任务执行之前指定回调函数

function successCallback(result){
    //成功的回调函数
}
function failCallback(error){
    //失败的回调函数
}
//使用纯回调函数
createAudioFileAsync(audioSettings,successCallback,failCallback)

2. Promise的方式 ---------指定回调函数在异步任务执行之前或者之后都可以

//1.创建promise对象
const p = new Promise((resolve,reject) => {
    //2.执行异步操作
    setTimeout(()=>{
        const time = Date.now();
        //3.1如果成功，执行resolve（value）
        if(time%2 == 0){
            resolve("成功的数据，time="+time);
        }else{
            //3.2如果失败，执行rejecte(reason)
            reject("fail Data，time="+time);
        }
    });
});
p.then(
    value =>{
        console.log('成功的回调',value);
    },
    reason =>{
        console.log("失败的回调",reason);
    }
)	

• 指定回调函数更加灵活

• 支持链式调用，可以解决回调地域（回调函数嵌套调用）的问题

  1. 什么是回调地狱
     

  2. 使用promise的链式调用解决回调地狱的问题

  doSomething().then(function(result){
      return doSomethingElse(result);//第一个成功的回调函数
  })
  .then(function(result){
      return doThirdThing(newResult);//第二个成功的回调函数
  })
  .then(function(finalResult){
      console.log('final result:'+finalResult);//最终的成功的回调函数
  })
  .catch(failureCallback)//失败的回调处理，最后处理
  

  3. async/await: 回调地狱的终极解决方案-----不用写回调函数
     

如何使用Promise

Promise的API

Promise中文文档

1. Promise构造函数:Promise (excutor） {}

   • excutor函数:同步执行(resolve,reject) =>{}
   • resolve函数:内部定义成功时我们调用的函数value =>{}
   • reject函数:内部定义失败时我们调用的函数reason =>{}

   说明:excutor会在Promise内部立即同步回调，异步操作在执行器中执行

2. Promise.prototype.then方法:(onResolved，onRejected）=>{}

   • onResolved函数:成功的回调函数(value）=>{}
   • onRejected函数:失败的回调函数(reasor)=>{}

   说明:指定用于得到成功value的成功回调和用于得到失败reason的失败回调，返回一个新的promise对象

3. Promise.prototype.catch方法:(onRejected) =>{}

• onRejected函数:失败的回调函数(reason) =>{}

说明:then(）的语法糖，相当于:.then(undefined，onRejected)

4. Promise.resolve方法:(value)=>{}

   • value:成功的数据或promise对象

   说明:返回一个成功/失败的promise对象

5. Promise.reject方法:(reason) =>{}

   • reason:失败的原因

   说明:返回一个失败的promise对象

6. Promise.all方法:(promises）=>{}

• promises:包含n个promise的数组

说明:返回一个新的promise，只有所有的promise都成功才成功，只要有一个失败了就直接失败

7. Promise.race方法:(promises） =>{}

• promises:包含n个promise的数组

说明:返回一个新的promise，第一个完成的promise的结果状态就是最终的结果状态