欧美bbbwbbbw肥妇,免费乱码人妻系列日韩,一级黄片

es6中Promise 對(duì)象基本功能與用法實(shí)例分析

 更新時(shí)間：2020年02月23日 11:34:11   作者：巴啦啦小能量  
這篇文章主要介紹了es6中Promise 對(duì)象基本功能與用法,結(jié)合實(shí)例形式分析了es6中Promise對(duì)象的基本功能、用法及操作注意事項(xiàng),需要的朋友可以參考下

本文實(shí)例講述了es6中Promise 對(duì)象基本功能與用法。分享給大家供大家參考，具體如下：

Promise 是異步編程的一種解決方案，解決——回調(diào)函數(shù)和事件

ES6 規(guī)定，Promise對(duì)象是一個(gè)構(gòu)造函數(shù)，用來生成Promise實(shí)例。

下面代碼創(chuàng)造了一個(gè)Promise實(shí)例。

基本用法

ES6 規(guī)定，Promise對(duì)象是一個(gè)構(gòu)造函數(shù)，用來生成Promise實(shí)例。

const promise = new Promise(function(resolve, reject) {
 //resolve （data）  成功
 //reject  （error ）失敗
});

Promise實(shí)例生成以后，可以用then方法分別指定resolved狀態(tài)和rejected狀態(tài)的回調(diào)函數(shù)。

promise.then(function(value) {
 // success
}, function(error) {
 // err
});

then方法可以接受兩個(gè)回調(diào)函數(shù)作為參數(shù)。第一個(gè)回調(diào)函數(shù)是Promise對(duì)象的狀態(tài)變?yōu)閞esolved時(shí)調(diào)用，第二個(gè)回調(diào)函數(shù)是Promise對(duì)象的狀態(tài)變?yōu)閞ejected時(shí)調(diào)用。其中，第二個(gè)函數(shù)是可選的，不一定要提供。這兩個(gè)函數(shù)都接受Promise對(duì)象傳出的值作為參數(shù)。

下面是一個(gè)Promise對(duì)象的簡(jiǎn)單例子

function fun(ms){
 return new promise((res,rej) => {
 setTimeout(res,ms)
 })
}
fun(100).then((val) => {
 console.log(val)
})

promise還可以用來加載圖片

function loadImageAsync(url) {
 return new Promise(function(resolve, reject) {
  const image = new Image();
  image.onload = function() {
   resolve(image);
  };
  image.onerror = function() {
   reject(new Error('Could not load image at ' + url));
  };
  image.src = url;
 });
}

上面代碼中，使用Promise包裝了一個(gè)圖片加載的異步操作。如果加載成功，就調(diào)用resolve方法，否則就調(diào)用reject方法。

2，用Promise對(duì)象實(shí)現(xiàn)的 Ajax 操作的例子。

const getJSON = function(url) {
 const promise = new Promise(function(resolve, reject){
  const handler = function() {
   if (this.readyState !== 4) {
    return;
   }
   if (this.status === 200) {
    resolve(this.response);
   } else {
    reject(new Error(this.statusText));
   }
  };
  const client = new XMLHttpRequest();
  client.open("GET", url);
  client.onreadystatechange = handler;
  client.responseType = "json";
  client.setRequestHeader("Accept", "application/json");
  client.send();
 });
 return promise;
};
getJSON("/posts.json").then(function(json) {
 console.log('Contents: ' + json);
}, function(error) {
 console.error('出錯(cuò)了', error);
});

注意，調(diào)用resolve或reject并不會(huì)終結(jié) Promise 的參數(shù)函數(shù)的執(zhí)行。

Promise.prototype.finally()

finally方法用于指定不管 Promise 對(duì)象最后狀態(tài)如何，都會(huì)執(zhí)行的操作。該方法是 ES2018 引入標(biāo)準(zhǔn)的。

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

上面代碼中，不管promise最后的狀態(tài)，在執(zhí)行完then或catch指定的回調(diào)函數(shù)以后，都會(huì)執(zhí)行finally方法指定的回調(diào)函數(shù),finally本質(zhì)上是then方法的特例。

Promise.resolve()

//有時(shí)需要將現(xiàn)有對(duì)象轉(zhuǎn)為 Promise 對(duì)象，Promise.resolve方法就起到這個(gè)作用。
const jsPromise = Promise.resolve($.ajax('/whatever.json'));

上面代碼將 jQuery 生成的deferred對(duì)象，轉(zhuǎn)為一個(gè)新的 Promise 對(duì)象。

Promise.resolve等價(jià)于下面的寫法。

Promise.resolve('foo')
// 等價(jià)于
new Promise(resolve => resolve('foo'))
//Promise.resolve方法的參數(shù)分成四種情況。

感興趣的朋友可以使用在線HTML/CSS/JavaScript代碼運(yùn)行工具：http://tools.jb51.net/code/HtmlJsRun測(cè)試上述代碼運(yùn)行效果。

更多關(guān)于JavaScript相關(guān)內(nèi)容可查看本站專題：《JavaScript操作DOM技巧總結(jié)》、《JavaScript頁面元素操作技巧總結(jié)》、《JavaScript事件相關(guān)操作與技巧大全》、《JavaScript查找算法技巧總結(jié)》、《JavaScript數(shù)據(jù)結(jié)構(gòu)與算法技巧總結(jié)》、《JavaScript遍歷算法與技巧總結(jié)》及《JavaScript錯(cuò)誤與調(diào)試技巧總結(jié)》

希望本文所述對(duì)大家JavaScript程序設(shè)計(jì)有所幫助。

相關(guān)文章

最新評(píng)論