把 Node.js 中的回調轉換爲 Promise

介紹

在幾年前,回調是 JavaScript 中實現執行異步代碼的惟一方法。回調自己幾乎沒有什麼問題,最值得注意的是「回調地獄」。javascript

在 ES6 中引入了 Promise 做爲這些問題的解決方案。最後經過引入 async/await 關鍵字來提供更好的體驗並提升了可讀性。html

即便有了新的方法,可是仍然有許多使用回調的原生模塊和庫。在本文中,咱們將討論如何將 JavaScript 回調轉換爲 Promise。 ES6 的知識將會派上用場,由於咱們將會使用 展開操做符之類的功能來簡化要作的事情。前端

什麼是回調

回調是一個函數參數,剛好是一個函數自己。雖然咱們能夠建立任何函數來接受另外一個函數,但回調主要用於異步操做。java

JavaScript 是一種解釋性語言,一次只能處理一行代碼。有些任務可能須要很長時間才能完成,例以下載或讀取大文件等。 JavaScript 將這些運行時間很長的任務轉移到瀏覽器或 Node.js 環境中的其餘進程中。這樣它就不會阻止其餘代碼的執行。node

一般異步函數會接受回調函數,因此完成以後能夠處理其數據。程序員

舉個例子,咱們將編寫一個回調函數,這個函數會在程序成功從硬盤讀取文件以後執行。面試

因此須要準備一個名爲 sample.txt 的文本文件,其中包含如下內容:編程

Hello world from sample.txt

而後寫一個簡單的 Node.js 腳原本讀取文件:segmentfault

const fs = require('fs');

fs.readFile('./sample.txt', 'utf-8', (err, data) => {
    if (err) {
        // 處理錯誤
        console.error(err);
          return;
    }
    console.log(data);
});

for (let i = 0; i < 10; i++) {
    console.log(i);
}

運行代碼後將會輸出:api

0
...
8
9
Hello world from sample.txt

若是這段代碼,應該在執行回調以前看到 0..9 被輸出到控制檯。這是由於 JavaScript 的異步管理機制。在讀取文件完畢以後,輸出文件內容的回調才被調用。

順便說明一下,回調也能夠在同步方法中使用。例如 Array.sort() 會接受一個回調函數,這個函數容許你自定義元素的排序方式。

接受回調的函數被稱爲「高階函數」。

如今咱們有了一個更好的回調方法。那麼們繼續看看什麼是 Promise。

什麼是 Promise

在 ECMAScript 2015(ES6)中引入了 Promise,用來改善在異步編程方面的體驗。顧名思義,JavaScript 對象最終將返回的「值」或「錯誤」應該是一個 Promise。

一個 Promise 有 3 個狀態:

  • Pending(待處理): 用來指示異步操做還沒有完成的初始狀態。
  • Fulfilled(已完成):表示異步操做已成功完成。
  • Rejected(拒絕):表示異步操做失敗。

大多數 Promise 最終看起來像這樣:

someAsynchronousFunction()
    .then(data => {
        // promise 被完成
        console.log(data);
    })
    .catch(err => {
        // promise 被拒絕
        console.error(err);
    });

Promise 在現代 JavaScript 中很是重要,由於它們與 ECMAScript 2016 中引入的 async/await 關鍵字一塊兒使用。使用 async / await 就不須要再用回調或 then()catch() 來編寫異步代碼。

若是要改寫前面的例子,應該是這樣:

try {
    const data = await someAsynchronousFunction();
} catch(err) {
    // promise 被拒絕
    console.error(err);
}

這看起來很像「通常的」同步 JavaScript。大多數流行的JavaScript庫和新項目都把 Promises 與 async/await 關鍵字放在一塊兒用。

可是,若是你要更新現有的庫或遇到舊的代碼,則可能會對將基於回調的 API 遷移到基於 Promise 的 API 感興趣,這樣能夠改善你的開發體驗。

來看一下將回調轉換爲 Promise 的幾種方法。

將回調轉換爲 Promise

Node.js Promise

大多數在 Node.js 中接受回調的異步函數(例如 fs 模塊)有標準的實現方式:把回調做爲最後一個參數傳遞。

例如這是在不指定文本編碼的狀況下用 fs.readFile() 讀取文件的方法:

fs.readFile('./sample.txt', (err, data) => {
    if (err) {
        console.error(err);
          return;
    }
    console.log(data);
});

注意:若是你指定 utf-8 做爲編碼,那麼獲得的輸出是一個字符串。若是不指定獲得的輸出是 Buffer

另外傳給這個函數的回調應接受 Error,由於它是第一個參數。以後能夠有任意數量的輸出。

若是你須要轉換爲 Promise 的函數遵循這些規則,那麼能夠用 util.promisify ,這是一個原生 Node.js 模塊,其中包含對 Promise 的回調。

首先導入ʻutil`模塊:

const util = require('util');

而後用 promisify 方法將其轉換爲 Promise:

const fs = require('fs');
const readFile = util.promisify(fs.readFile);

如今,把新建立的函數用做 promise:

readFile('./sample.txt', 'utf-8')
    .then(data => {
        console.log(data);
    })
    .catch(err => {
        console.log(err);
    });

另外也能夠用下面這個示例中給出的 async/await 關鍵字:

const fs = require('fs');
const util = require('util');

const readFile = util.promisify(fs.readFile);

(async () => {
    try {
        const content = await readFile('./sample.txt', 'utf-8');
        console.log(content);
    } catch (err) {
        console.error(err);
    }
})();

你只能在用 async 建立的函數中使用 await 關鍵字,這也是爲何要使用函數包裝器的緣由。函數包裝器也被稱爲當即調用的函數表達式。

若是你的回調不遵循這個特定標準也不用擔憂。 util.promisify() 函數可以讓你自定義轉換是如何發生的。

注意: Promise 在被引入後不久就開始流行了。 Node.js 已經將大部分核心函數從回調轉換成了基於 Promise 的API。

若是須要用 Promise 處理文件,能夠用 Node.js 附帶的庫(https://nodejs.org/docs/lates...)。

如今你已經瞭解瞭如何將 Node.js 標準樣式回調隱含到 Promise 中。從 Node.js 8 開始,這個模塊僅在 Node.js 上可用。若是你用的是瀏覽器或早期版本版本的 Node,則最好建立本身的基於 Promise 的函數版本。

建立你本身的 Promise

讓咱們討論一下怎樣把回調轉爲 util.promisify() 函數的 promise。

思路是建立一個新的包含回調函數的 Promise 對象。若是回調函數返回錯誤,就拒絕帶有該錯誤的Promise。若是回調函數返回非錯誤輸出,就解決並輸出 Promise。

先把回調轉換爲一個接受固定參數的函數的 promise 開始:

const fs = require('fs');

const readFile = (fileName, encoding) => {
    return new Promise((resolve, reject) => {
        fs.readFile(fileName, encoding, (err, data) => {
            if (err) {
                return reject(err);
            }

            resolve(data);
        });
    });
}

readFile('./sample.txt')
    .then(data => {
        console.log(data);
    })
    .catch(err => {
        console.log(err);
    });

新函數 readFile() 接受了用來讀取 fs.readFile() 文件的兩個參數。而後建立一個新的 Promise 對象,該對象包裝了該函數,並接受回調,在本例中爲 fs.readFile()

reject Promise 而不是返回錯誤。因此代碼中沒有當即把數據輸出,而是先 resolve 了Promise。而後像之前同樣使用基於 Promise 的 readFile() 函數。

接下來看看接受動態數量參數的函數:

const getMaxCustom = (callback, ...args) => {
    let max = -Infinity;

    for (let i of args) {
        if (i > max) {
            max = i;
        }
    }

    callback(max);
}

getMaxCustom((max) => { console.log('Max is ' + max) }, 10, 2, 23, 1, 111, 20);

第一個參數是 callback 參數,這使它在接受回調的函數中有點不同凡響。

轉換爲 promise 的方式和上一個例子同樣。建立一個新的 Promise 對象,這個對象包裝使用回調的函數。若是遇到錯誤,就 reject,當結果出現時將會 resolve

咱們的 promise 版本以下:

const getMaxPromise = (...args) => {
    return new Promise((resolve) => {
        getMaxCustom((max) => {
            resolve(max);
        }, ...args);
    });
}

getMaxCustom(10, 2, 23, 1, 111, 20)
    .then(max => console.log(max));

在建立 promise 時,無論函數是以非標準方式仍是帶有許多參數使用回調都可有可無。咱們能夠徹底控制它的完成方式,而且原理是同樣的。

總結

儘管如今回調已成爲 JavaScript 中利用異步代碼的默認方法,但 Promise 是一種更現代的方法,它更容易使用。若是遇到了使用回調的代碼庫,那麼如今就能夠把它轉換爲 Promise。

在本文中,咱們首先學到了如何 在Node.js 中使用 utils.promisfy() 方法將接受回調的函數轉換爲 Promise。而後,瞭解瞭如何建立本身的 Promise 對象,並在對象中包裝了無需使用外部庫便可接受回調的函數。這樣許多舊 JavaScript 代碼能夠輕鬆地與現代的代碼庫和混合在一塊兒。

173382ede7319973.gif


本文首發微信公衆號:前端先鋒

歡迎掃描二維碼關注公衆號,天天都給你推送新鮮的前端技術文章

歡迎掃描二維碼關注公衆號,天天都給你推送新鮮的前端技術文章

歡迎繼續閱讀本專欄其它高贊文章:


相關文章
相關標籤/搜索