ES6中的異步解決方案有哪些-創(chuàng)新互聯(lián)

ES6中的異步解決方案有哪些？相信很多沒有經(jīng)驗的人對此束手無策，為此本文總結(jié)了問題出現(xiàn)的原因和解決方法，通過這篇文章希望你能解決這個問題。

創(chuàng)新互聯(lián)公司擁有一支富有激情的企業(yè)網(wǎng)站制作團(tuán)隊，在互聯(lián)網(wǎng)網(wǎng)站建設(shè)行業(yè)深耕十余年，專業(yè)且經(jīng)驗豐富。十余年網(wǎng)站優(yōu)化營銷經(jīng)驗，我們已為數(shù)千家中小企業(yè)提供了做網(wǎng)站、成都網(wǎng)站建設(shè)解決方案，定制網(wǎng)站建設(shè)，設(shè)計滿意，售后服務(wù)無憂。所有客戶皆提供一年免費網(wǎng)站維護(hù)!

前置知識準(zhǔn)備

  1. Generator 函數(shù) 執(zhí)行會返回一個迭代器(Iterator), 在迭代器上可以調(diào)用  next() 方法, 執(zhí)行下一個 yield  或 return

  2. 調(diào)用  next() 方法，會返回一個對象 {value: res, done: false} , value 的值 為 yield 之后表達(dá)式的值，done 的值 表示迭代器，是否已經(jīng)執(zhí)行完畢（最后一個yield  或 return ）

  3. next() 方法，可以傳入一個值，做為前一個yield 表達(dá)式的返回值

有了這些知識，可以把Promise 對象 做一個的 yield 的值，配合一個執(zhí)行器，來處理異步操作

方式一： Generator + Promise + 執(zhí)行器

const fs = require('fs')

// Promise 版的readFile
const readFile = function (fileName) {
 return new Promise(function(resolve, reject) {
  fs.readFile(fileName, function(err, data){
   if (err) return reject(error);
   resolve(data);
  })
 })
}

const gen = function * () {
 let f1 = yield readFile('a.txt');
 let f2 = yield readFile('b.txt');

 console.log('F1--->', f1.toString());
 console.log('F2--->', f2.toString());
}


// 基于 Generator 和 Promise 的自動執(zhí)行器
function run(gen) {

 let g = gen();
 
 function next(data) {
  
  let result = g.next(data);

  if (result.done) return result.value;

  result.value.then(function(data) {
   next(data);
  });
 }
 next();
}

run(gen);

執(zhí)行器 中的 result.value 現(xiàn)在是一個Promise, 通過 then 方法拿到需要的結(jié)果，傳下一次 next 方法，這樣 let f1 = yield readFile('a.txt');  就可以拿到值！

方式二：Generator + Thunk函數(shù) + 執(zhí)行器

const fs = require('fs')

// 把一個單一執(zhí)行的函數(shù) ，變成需要再次調(diào)用的函數(shù)，固定一部分參數(shù)
function thunkify(fn, obj = {}) {
  return function () {
    let args = Array.from(arguments);
    return function (m) {
      args.push(m)
      return fn.apply(obj, args)
    }
  }
}

const readFile = thunkify(fs.readFile, fs);

const gen = function* () {
  let f1 = yield readFile('a.txt');
  let f2 = yield readFile('b.txt');

  console.log('F1-->', f1.toString());
  console.log('F2-->', f2.toString());
}


// 基于 Generator 和 Thunk函數(shù)的自動執(zhí)行器
function run(fn) {
  let gen = fn();

  function next(err, data) {
    let result = gen.next(data);
    if (result.done) return 1;
    result.value(next);
  }

  next();

}

run(gen);

這里的 Thunk 轉(zhuǎn)換器，把原來的 fs.readFile 函數(shù) 轉(zhuǎn)換成需要兩次調(diào)用的函數(shù) ，readFile 的執(zhí)行結(jié)果，可以通過回調(diào)函數(shù)能參數(shù)傳遞出來，再傳給 next 方法

方式三：基于 async 函數(shù) 和 await 的異步處理方式

const fs = require('fs')

// Promise 版的readFile
const readFile = function (fileName) {
 return new Promise(function(resolve, reject) {
  fs.readFile(fileName, function(err, data){
   if (err) return reject(err);
   resolve(data);
  })
 })
}

const asyncReadFile = async function () {
 const f1 = await readFile('a.txt');
 const f2 = await readFile('b.txt');
 console.log(f1.toString());
 console.log(f2.toString());
};

asyncReadFile();

readFile 函數(shù) 對比方式一沒有大的變化 ，Generator 函數(shù)變成 了 async 函數(shù)，可見 這處方式 只是 方式一的一個語法糖，async 函數(shù)自帶了執(zhí)行器！

看完上述內(nèi)容，你們掌握ES6中的異步解決方案有哪些的方法了嗎？如果還想學(xué)到更多技能或想了解更多相關(guān)內(nèi)容，歡迎關(guān)注創(chuàng)新互聯(lián)成都網(wǎng)站設(shè)計公司行業(yè)資訊頻道，感謝各位的閱讀！

另外有需要云服務(wù)器可以了解下創(chuàng)新互聯(lián)scvps.cn，海內(nèi)外云服務(wù)器15元起步，三天無理由+7*72小時售后在線，公司持有idc許可證，提供“云服務(wù)器、裸金屬服務(wù)器、高防服務(wù)器、香港服務(wù)器、美國服務(wù)器、虛擬主機(jī)、免備案服務(wù)器”等云主機(jī)租用服務(wù)以及企業(yè)上云的綜合解決方案，具有“安全穩(wěn)定、簡單易用、服務(wù)可用性高、性價比高”等特點與優(yōu)勢，專為企業(yè)上云打造定制，能夠滿足用戶豐富、多元化的應(yīng)用場景需求。

網(wǎng)站欄目：ES6中的異步解決方案有哪些-創(chuàng)新互聯(lián)
標(biāo)題路徑：http://muchs.cn/article44/djgcee.html

成都網(wǎng)站建設(shè)公司_創(chuàng)新互聯(lián)，為您提供動態(tài)網(wǎng)站、微信公眾號、網(wǎng)頁設(shè)計公司、品牌網(wǎng)站制作、服務(wù)器托管、網(wǎng)站建設(shè)

廣告

聲明：本網(wǎng)站發(fā)布的內(nèi)容（圖片、視頻和文字）以用戶投稿、用戶轉(zhuǎn)載內(nèi)容為主，如果涉及侵權(quán)請盡快告知，我們將會在第一時間刪除。文章觀點不代表本網(wǎng)站立場，如需處理請聯(lián)系客服。電話：028-86922220；郵箱：631063699@qq.com。內(nèi)容未經(jīng)允許不得轉(zhuǎn)載，或轉(zhuǎn)載時需注明來源： 創(chuàng)新互聯(lián)

成都app開發(fā)公司