Callback 與 Promise 間的橋梁 —— promisify

RayKr 發(fā)布于2019-08-21 17:22 / 1680人閱讀

摘要：今天要介紹的是，就是回調(diào)函數(shù)與間的橋梁。什么樣的叫有兩個(gè)條件回調(diào)函數(shù)在主函數(shù)中的參數(shù)位置必須是最后一個(gè)回調(diào)函數(shù)參數(shù)中的第一個(gè)參數(shù)必須是。

作者：晃晃
本文原創(chuàng)，轉(zhuǎn)載請(qǐng)注明作者及出處

Promise 自問(wèn)世以來(lái)，得到了大量的應(yīng)用，簡(jiǎn)直是 javascript 中的神器。它很好地解決了異步方法的回調(diào)地獄、提供了我們?cè)诋惒椒椒ㄖ惺褂?return 的能力，并將 callback 的調(diào)用納入了自己的管理，而不是交給異步函數(shù)后我們就無(wú)能為力了（經(jīng)常有 callback 被莫名調(diào)用兩次而導(dǎo)致程序出錯(cuò)）。

今天要介紹的是 Promisify，就是回調(diào)函數(shù)與 Promise 間的橋梁。

1. promisify 介紹

什么是 promisify 呢？顧名思義，就是“promise 化”，將一個(gè)不是promise的方法變成 promise 。舉個(gè)例子：

// 原有的callback調(diào)用
fs.readFile("test.js", function(err, data) {
    if (!err) {
        console.log(data);
    } else {
        console.log(err);
    }
});

// promisify后
var readFileAsync = promisify(fs.readFile);
readFileAsync("test.js").then(data => {
    console.log(data);
}, err => {
    console.log(err);
});

這兩個(gè)方法效果上是等價(jià)的，但是從掌控性來(lái)說(shuō)的話，我更喜歡后面的寫法。

那么什么樣的方法可以通過(guò) promisify 變成 promise 呢？這里就需要介紹一個(gè)名詞，nodeCallback。什么樣的 callback 叫 nodeCallback ？

nodeCallback 有兩個(gè)條件：1. 回調(diào)函數(shù)在主函數(shù)中的參數(shù)位置必須是最后一個(gè)；2. 回調(diào)函數(shù)參數(shù)中的第一個(gè)參數(shù)必須是 error 。舉個(gè)例子：

回調(diào)函數(shù)在主函數(shù)中的參數(shù)位置

// 正確
function main(a, b, c, callback) {
    
}

// 錯(cuò)誤
function main(callback, a, b, c) {
    
}

回調(diào)函數(shù)參數(shù)中的第一個(gè)參數(shù)必須是 error

// 正確
function callback(error, result1, result2) {
    
}

// 錯(cuò)誤
function callback(result1, result2, error) {
    
}

這樣，通過(guò) nodeCallback ，我們定義了一個(gè)能被 promisify 的函數(shù)的格式，即，滿足 nodeCallback 形式的方法，我們可以通過(guò) promisify 來(lái)讓它變成一個(gè)返回 promise 的方法。

2. promisify 的實(shí)現(xiàn)

下面我們來(lái)根據(jù)上述條件來(lái)手動(dòng)實(shí)現(xiàn)一個(gè) promisify 。

首先 promisify 需要返回一個(gè) function ，并且這個(gè) function 要返回一個(gè) promise

var promisify = (func) => {
    return function() {
        var ctx = this;
        return new Promise(resolve => {
            return func.call(ctx, ...arguments);
        })
    }
}

其次，原 func 的最后一個(gè)參數(shù)是 callback

var promisify = (func) => {
    return function() {
        var ctx = this;
        return new Promise(resolve => {
            return func.call(ctx, ...arguments, function() {
                resolve(arguments);
            });
        })
    }
}

然后，回調(diào)函數(shù)中的第一個(gè)參數(shù)是 error 標(biāo)記

var promisify = (func) => {
    return function() {
        var ctx = this;
        return new Promise((resolve, reject) => {
            return func.call(ctx, ...arguments, function() {
                var args = Array.prototype.map.call(arguments, item => item);
                var err = args.shift();
                if (err) {
                    reject(err);
                } else {
                    resolve(args);
                }
            });
        })
    }
}

最后，做一些優(yōu)化，比如 this 作用域的自定義、回參只有一個(gè)時(shí)不返回?cái)?shù)組

var promisify = (func, ctx) => {
    // 返回一個(gè)新的function
    return function() {
        // 初始化this作用域
        var ctx = ctx || this;
        // 新方法返回的promise
        return new Promise((resolve, reject) => {
            // 調(diào)用原來(lái)的非promise方法func，綁定作用域，傳參，以及callback（callback為func的最后一個(gè)參數(shù)）
            func.call(ctx, ...arguments, function() {
                // 將回調(diào)函數(shù)中的的第一個(gè)參數(shù)error多帶帶取出
                var args = Array.prototype.map.call(arguments, item => item);
                var err = args.shift();
                // 判斷是否有error
                if (err) {
                    reject(err)
                } else {
                    // 沒(méi)有error則將后續(xù)參數(shù)resolve出來(lái)
                    args = args.length > 1 ? args : args[0];
                    resolve(args);
                }
            });
        })
    };
};

測(cè)試

// nodeCallback方法func1
var func1 = function(a, b, c, callback) {
    callback(null, a+b+c);
}
// promise化后的func2
var func2 = promisify(func1);
// 調(diào)用后輸出6
func1(1, 2, 3, (err, reuslt) => {
    if (!err) {
        console.log(result); //輸出6
    }
})
func2(1, 2, 3).then(console.log); //輸出6

以上便是 promisify 的介紹和實(shí)現(xiàn)，事實(shí)上有很多用 callback 來(lái)實(shí)現(xiàn)異步的第三方庫(kù)提供的方法都是按照 nodeCallback 格式的，所以它們都可以通過(guò) promisify 來(lái)讓它變成 promise ，在遇到這些方法的時(shí)候就可以更靈活地使用啦。

iKcamp官網(wǎng)：http://www.ikcamp.com
訪問(wèn)官網(wǎng)更快閱讀全部免費(fèi)分享課程：《iKcamp出品｜全網(wǎng)最新｜微信小程序｜基于最新版1.0開(kāi)發(fā)者工具之初中級(jí)培訓(xùn)教程分享》。
包含：文章、視頻、源代碼

iKcamp原創(chuàng)新書《移動(dòng)Web前端高效開(kāi)發(fā)實(shí)戰(zhàn)》已在亞馬遜、京東、當(dāng)當(dāng)開(kāi)售。

【11月11號(hào)】上海iKcamp最新活動(dòng)

報(bào)名地址：http://www.huodongxing.com/ev...
與“天天練口語(yǔ)”小程序總榜排名第四、教育類排名第一的研發(fā)團(tuán)隊(duì)，面對(duì)面溝通交流。

文章版權(quán)歸作者所有，未經(jīng)允許請(qǐng)勿轉(zhuǎn)載,若此文章存在違規(guī)行為，您可以聯(lián)系管理員刪除。

轉(zhuǎn)載請(qǐng)注明本文地址：http://m.hztianpu.com/yun/89433.html

發(fā)表評(píng)論

登陸后可評(píng)論

0條評(píng)論

RayKr

男|高級(jí)講師

我要關(guān)注我要私信

TA的文章

服務(wù)器主機(jī)怎么登陸-虛擬主機(jī)怎么登陸圖解？

閱讀 3174·2021-09-22 15:54
wevps：臺(tái)灣vps,1GB內(nèi)存/20GB SSD空間/3TB流量/1Gbps端口/KVM/原生I

閱讀 4098·2021-09-09 11:34
javascript 判斷變量是否是數(shù)組（Array）

閱讀 1834·2019-08-30 12:48
單/多行文本溢出省略

閱讀 1222·2019-08-30 11:18
react-native電影簡(jiǎn)介app，了解一下？（android端）

閱讀 3516·2019-08-26 11:48
js數(shù)組去重

閱讀 979·2019-08-23 17:50
JavaScript 工廠函數(shù) vs 構(gòu)造函數(shù)

閱讀 2182·2019-08-23 17:17
關(guān)于數(shù)組forEach方法的封裝

閱讀 1313·2019-08-23 17:12

成人无码视频,亚洲精品久久久久av无码,午夜精品久久久久久毛片,亚洲中文字幕日韩无码

資訊專欄INFORMATION COLUMN

上云采購(gòu)季！| 2核2G4M爆款云服務(wù)器低至59元/年，更有多臺(tái)、長(zhǎng)期優(yōu)惠，快來(lái)選購(gòu)！

Callback 與 Promise 間的橋梁 —— promisify

相關(guān)文章

util.promisify 的那些事兒

Promisify 的源碼解析

***Promise化，Promisify，將函數(shù)改成既支持Callback回調(diào)，又支持Promise***

Promise與遍歷（循環(huán)，無(wú)窮多的then）遇到的問(wèn)題及三個(gè)解決方案

適配器在JavaScript中的體現(xiàn)

發(fā)表評(píng)論

0條評(píng)論

RayKr

男|高級(jí)講師

TA的文章

服務(wù)器主機(jī)怎么登陸-虛擬主機(jī)怎么登陸圖解？

wevps：臺(tái)灣vps,1GB內(nèi)存/20GB SSD空間/3TB流量/1Gbps端口/KVM/原生I

javascript 判斷變量是否是數(shù)組（Array）

單/多行文本溢出省略

react-native電影簡(jiǎn)介app，了解一下？（android端）

js數(shù)組去重

JavaScript 工廠函數(shù) vs 構(gòu)造函數(shù)

關(guān)于數(shù)組forEach方法的封裝

最新活動(dòng)

資訊專欄INFORMATION COLUMN

上云采購(gòu)季！| 2核2G4M爆款云服務(wù)器低至59元/年，更有多臺(tái)、長(zhǎng)期優(yōu)惠，快來(lái)選購(gòu)！

Callback 與 Promise 間的橋梁 —— promisify

相關(guān)文章

發(fā)表評(píng)論

0條評(píng)論

男|高級(jí)講師

TA的文章

最新活動(dòng)

上云采購(gòu)季！| 2核2G4M爆款云服務(wù)器低至59元/年，更有多臺(tái)、長(zhǎng)期優(yōu)惠，快來(lái)選購(gòu)！