Promise對象入門

hosition 發布于2019-08-22 15:03 / 1164人閱讀

摘要：不管對象最后結果如何，都會執行的操作，方法中的回調函數不接受任何參數方法用于將多個實例包裝成一個新的實例只有的狀態都變成，的狀態才會變成，此時的返回值組成一個數組，傳遞給的回調函數。

簡介

promise對象可以獲取異步操作的消息，提供統一的API,各個異步操作都可以用同樣的方法進行處理。
promise對象不受外界影響，其有三種狀態：pending（進行中）、fulfilled（成功）、rejected（失敗），只有異步操作的結果可以決定當前狀態，一旦狀態改變就不可以再變化，狀態改變方向有兩種：pending -> fulfilled、pending -> rejected
promise對象的意義就在于將異步操作以同步操作的流程表達，避免層層嵌套的回調函數

基本用法

let promise = new Promise(function (resolve, reject) {
  if () {
    resolve(value) // 異步操作成功
  } else {
    reject(error) // 失敗拋錯
  }
})

Promise構造函數接受一個函數作為參數，該函數有兩個參數：resolve、reject，當執行resolve函數時Promise對象狀態pending -> fulfilled，當執行reject時Promise對象狀態pending -> rejected

promise.then(function (value) {
  
}, function (error) {
  
})

Promise實例生成以后，可以用then方法分別指定resolved狀態和rejected狀態的回調函數，第二個參數為可選參數，例子：

let promise = new Promise(function (resolve, reject) {
  console.log("promise")
  resolve("11")
})
promise.then(function (value) {
  console.log(value)
})
console.log("22")

執行結果"promise -> 22 -> 11",promise對象新建后立即執行，then方法的回調會在所有同步任務執行完成后執行

catch

promise.prototype.catch()是then()方法的別名，用于指定發生錯誤時的回調函數

new Promise(function () {

}).then(() => {

}).catch(err => {
  console.log(err)
})

如果異步操作拋出錯誤，狀態就會變為reject，就會調用catch中的回調，當狀態為resolve，執行then方法中的回調時，若報錯同樣回進入catch的回調
意義：當我們使用promise異步操作時，但是沒有使用catch捕獲錯誤時，若promise異步執行報錯時，外部代碼并不會接收到錯誤，而是繼續執行不受影響

const someAsyncThing = function() {
  return new Promise(function(resolve, reject) {
    resolve(x);
  });
};
someAsyncThing().then(function() {
  console.log("ok");
});
setTimeout(() => { console.log("continue") }, 100);

如代碼所示，x變量并沒有定義，期待的操作是執行報錯，然后停止運行，實際上‘continue’會執行輸出，這說明當沒有catch捕獲錯誤時，外部代碼不會知道Promise對象內部執行已經報錯，因此會繼續執行。

finally

不管Promise對象最后結果如何，都會執行的操作，finally方法中的回調函數不接受任何參數

promise
.then(result => {···})
.catch(error => {···})
.finally(() => {···});

all

Promise.all方法用于將多個Promise實例包裝成一個新的實例

Promise.all([p1,p2,p3]).then((array) => {
  
}).catch((err) => {
  
})

只有p1、p2、p3的狀態都變成fulfilled，p的狀態才會變成fulfilled，此時p1、p2、p3的返回值組成一個數組，傳遞給p的回調函數。
只要p1、p2、p3之中有一個被rejected，p的狀態就變成rejected，此時第一個被reject的實例的返回值，會傳遞給p的回調函數。

文章版權歸作者所有，未經允許請勿轉載,若此文章存在違規行為，您可以聯系管理員刪除。

轉載請注明本文地址：http://specialneedsforspecialkids.com/yun/93128.html

Promise入門之基本用法

摘要：入門之基本用法背景在我們使用異步函數比如進行編寫代碼，如果我們需要很多個請求不同的接口，而下一個接口需要依賴上一個接口的返回值，這樣，我們的代碼則需要在各種回調函數中嵌套，這樣一層一層地下去，就形成了回調地獄。 Promise入門之基本用法背景在我們使用異步函數比如ajax進行編寫代碼，如果我們需要很多個ajax請求不同的接口，而下一個接口需要依賴上一個接口的返回值，這樣，我們的代...

siberiawolf 2019-08-23 16:30 評論0 收藏0
【前端】ES6入門基礎知識

摘要：關于的入門了解新增模板字符串為提供了簡單的字符串插值功能箭頭函數操作符左邊為輸入的參數，而右邊則是進行的操作以及返回的值。將對象納入規范，提供了原生的對象。增加了和命令，用來聲明變量。關于ES6的入門了解新增模板字符串（為JavaScript提供了簡單的字符串插值功能）、箭頭函數（操作符左邊為輸入的參數，而右邊則是進行的操作以及返回的值Inputs=>outputs。）、for-o...

philadelphia 2019-08-21 17:21 評論0 收藏0
ECMAScript 6入門Promise對象

摘要：對象的狀態不受外界影響。如果改變已經發生了，你再對對象添加回調函數，也會立即得到這個結果。會等中的對象全部執行完后將數組傳入回調函數中與不同的是只要之中有一個實例率先改變狀態，的狀態就跟著改變。 Promise對象剛學習完，有點粗略印象。整理記錄一下以便后續學習補充，加深理解。 Promise是什么 Promise是構造函數，可以通過new來生成Promise對象。 Promise有...

ingood 2019-08-23 12:30 評論0 收藏0
ES6入門到進階（二）：循環、數組、對象

摘要：優點按需加載可以寫中路徑也可以動態加以后默認就是嚴格模式，默認嚴格模式完參考視頻資料經典入門到進階上一篇：ES6入門到進階（一）：let、解構賦值、字符串模板、函數一、循環 ES5里面新增一些東西 1.1 arr.forEach()(常用) 1. for for(let i=0; i [{t:aaaa}] let arr = [ ...

JerryZou 2019-08-26 11:47 評論0 收藏0
Promise學習:基礎入門

摘要：今天來學習下吧其實這在筆試上也是一個考點基本介紹對象是熟悉的名字吧工作組提出的規范原本只是社區提出的構想一些外部函數庫率先實現了該功能中將其寫入了語言標準目的為異步操作提供統一接口是啥它就是一個中一個對象起著代理作用充當異步操作與回調函今天來學習下Promise吧,其實這在筆試上也是一個考點. 基本介紹 Promise對象是CommonJS(熟悉的名字吧- -)工作組提出的規范.Pr...

iamyoung001 2019-08-21 14:27 評論0 收藏0