本文主要強(qiáng)調(diào)Promise的用法,討究Promise究竟在干什么。雖然已有大量的資料文檔對(duì)這個(gè)概念進(jìn)行了詳細(xì)的講解?？墒菍?duì)初學(xué)者而言，在過于繁瑣的書面性概念中，確常常無法抓住重點(diǎn)，對(duì)問題本身的理解反而會(huì)造成麻煩。本文章只將重點(diǎn)放在作用上，忽略掉其它繁雜的概念，用盡可能直白的語言對(duì)這個(gè)問題進(jìn)行剖析。閱讀本文需要十分鐘左右的時(shí)間，希望對(duì)您能有所幫助。

### **Promise：**

### **作用：解決回調(diào)地獄問題,將函數(shù)嵌套的代碼方式改為平級(jí)的。**

當(dāng)一個(gè)回調(diào)函數(shù)嵌套一個(gè)回調(diào)函數(shù)的時(shí)候，就會(huì)出現(xiàn)一個(gè)嵌套結(jié)構(gòu)，當(dāng)嵌套的多了就會(huì)出現(xiàn)回調(diào)地獄的情況。

為了能更加清晰的體會(huì)promise,我們需要先觀察一段代碼。

```text
        function f1(f){
  console.log("f1");
  f();
 }
 
 function f2(f){
  console.log("f2");
  f();
 }
 
 function f3(f){
  console.log("f3");
  f();
 }
 
 function f4(){
  console.log("f4");
 }
 
 //回調(diào)地獄
 f1(function(){
  f2(function(){
   f3(f4);
  });
 });
```

代碼段有四個(gè)函數(shù),f1,f2,f3,f4均為函數(shù),且后一個(gè)函數(shù)作為前一個(gè)函數(shù)的參數(shù)，然后進(jìn)行嵌套調(diào)用。最終從調(diào)用的語法來看，代碼十分復(fù)雜，我們把回調(diào)函數(shù)這樣調(diào)用稱為回調(diào)地獄。

**Pomise的作用就是將嵌套的調(diào)用方式改為平級(jí)的。**也就是說從調(diào)用的結(jié)果上來看，最終本質(zhì)上是沒有任何區(qū)別，Pormise只是改變了語法的書寫規(guī)則。這就是Pomise的基本使用方法。

Promise的語法規(guī)則如下:

```text
        //使用方法
 //1.通常放入一個(gè)函數(shù)體內(nèi)
 //2.將promise對(duì)象作為返回值
 //3.promise對(duì)象包含的多為異步操作
 function fun(){
        //success表示成功的回調(diào),failed表示失敗時(shí)的回調(diào)
  let p = new Promise(function(success,failed){
   if(條件){
    success();
   }else{
    failed();
   }
  });
  return p;
 }
 
 function success(){
  console.log("success");
 }
 
 function failed(){
  console.log("failed");
 }
 
        //promise對(duì)象.then(成功的方法,[失敗的方法]);
 fun().then(success,failed);
```

這里promise對(duì)象可以將以前通過形參傳遞的回調(diào)函數(shù),用then方法來進(jìn)行傳遞。其實(shí)promise主要處理的是異步操作，如常見的如ajax請(qǐng)求。我們的每一個(gè)異步事件，在執(zhí)行的時(shí)候，都會(huì)有三種狀態(tài)，執(zhí)行中，成功，失敗。這也就解釋了為什么then方法為什么會(huì)有兩個(gè)參數(shù)，參數(shù)1代表成功時(shí)執(zhí)行的回調(diào)函數(shù)，參數(shù)2代表失敗時(shí)的執(zhí)行狀態(tài)。

所以上述函數(shù)嵌套調(diào)用的代碼可以修改為:

```text
        function f1(){
  console.log("f1");
  let p = new Promise(function(f){
   f();
  });
  return p;
 }
 
 function f2(){
  console.log("f2");
  let p = new Promise(function(f){
   f();
  });
  return p;
 }
 
 function f3(){
  console.log("f3");
  let p = new Promise(function(f){
   f();
  });
  return p;
 }
 
 function f4(){
  console.log("f4");
 }
 
 //平級(jí)調(diào)用的方法
 f1().then(f2).then(f3).then(f4);
```

這樣實(shí)現(xiàn)的功能和上述代碼的功能是完全一樣的，但是解決了函數(shù)嵌套調(diào)用的麻煩。

結(jié)論:**Pomise的作用就是將嵌套的調(diào)用方式改為平級(jí)的，用于處理異步操作。**

更多關(guān)于“html5培訓(xùn)”的問題，歡迎咨詢千鋒教育在線名師。千鋒已有十余年的培訓(xùn)經(jīng)驗(yàn)，課程大綱更科學(xué)更專業(yè)，有針對(duì)零基礎(chǔ)的就業(yè)班，有針對(duì)想提升技術(shù)的提升班，高品質(zhì)課程助理你實(shí)現(xiàn)夢(mèng)想。