Как преобразовать существующий API обратного вызова в promises?
Я хочу работать с обещаниями, но у меня есть API обратного вызова в формате, например:
1. Загрузка DOM или другое однократное событие:
window.onload; // set to callback
...
window.onload = function() {
};
2. Обычный обратный вызов:
function request(onChangeHandler) {
...
}
request(function() {
// change happened
...
});
3. Обратный вызов стиля узла ("nodeback"):
function getStuff(dat, callback) {
...
}
getStuff("dataParam", function(err, data) {
...
})
4. Целая библиотека с обратными вызовами стиля узла:
API;
API.one(function(err, data) {
API.two(function(err, data2) {
API.three(function(err, data3) {
...
});
});
});
Как я могу работать с API в обещаниях, как я могу "его обещать"?
Ответы
Ответ 1
Обещания имеют статус, они начинаются как ожидающие и могут рассчитывать на:
- выполнив это означает, что вычисление завершено успешно.
- отклонено означает, что вычисление не удалось.
Функции возврата обещаний никогда не должны выдаваться, вместо этого они должны возвращать отклонения. Функция возврата из обещания заставит вас использовать и } catch {
и .catch
. Люди, использующие обещанные API-интерфейсы, не ожидают обещаний. Если вы не уверены, как работают асинхронные API в JS - сначала посмотрите этот ответ.
1. Загрузка DOM или другое одноразовое событие:
Таким образом, создание обещаний обычно означает указание того, когда они выполняются, то есть когда они переходят к выполненной или отклоненной фазе, чтобы указать, что данные доступны (и могут быть доступны с помощью .then
).
С современными реализациями обещаний, которые поддерживают конструктор Promise
как родные обещания ES6:
function load() {
return new Promise(function(resolve, reject) {
window.onload = resolve;
});
}
Затем вы будете использовать полученное обещание так:
load().then(function() {
// Do things after onload
});
С библиотеками, которые поддерживают отложенный (давайте используем здесь $ q для этого примера, но мы также будем использовать jQuery позже):
function load() {
var d = $q.defer();
window.onload = function() { d.resolve(); };
return d.promise;
}
Или с помощью jQuery-подобного API, перехватывая событие, происходящее один раз:
function done() {
var d = $.Deferred();
$("#myObject").once("click",function() {
d.resolve();
});
return d.promise();
}
2. Простой обратный вызов:
Эти API довольно распространены, так как... обратные вызовы распространены в JS. Давайте рассмотрим общий случай наличия onSuccess
и onFail
:
function getUserData(userId, onLoad, onFail) { …
С современными реализациями обещаний, которые поддерживают конструктор Promise
как родные обещания ES6:
function getUserDataAsync(userId) {
return new Promise(function(resolve, reject) {
getUserData(userId, resolve, reject);
});
}
С библиотеками, которые поддерживают отложенный (давайте используем jQuery для этого примера здесь, но мы также использовали $ q выше):
function getUserDataAsync(userId) {
var d = $.Deferred();
getUserData(userId, function(res){ d.resolve(res); }, function(err){ d.reject(err); });
return d.promise();
}
jQuery также предлагает форму $.Deferred(fn)
, которая позволяет нам написать выражение, которое очень близко имитирует new Promise(fn)
форму new Promise(fn)
, следующим образом:
function getUserDataAsync(userId) {
return $.Deferred(function(dfrd) {
getUserData(userId, dfrd.resolve, dfrd.reject);
}).promise();
}
Примечание. Здесь мы используем тот факт, что jQuery-методы с отложенным resolve
и reject
являются "отсоединяемыми"; то есть. они связаны с экземпляром jQuery.Deferred(). Не все библиотеки предлагают эту функцию.
3. Обратный вызов стиля узла ("nodeback"):
Обратные вызовы стиля узла (nodebacks) имеют определенный формат, где обратные вызовы всегда являются последним аргументом, а его первый параметр является ошибкой. Позвольте сначала пообещать один вручную:
getStuff("dataParam", function(err, data) { …
Для того, чтобы:
function getStuffAsync(param) {
return new Promise(function(resolve, reject) {
getStuff(param, function(err, data) {
if (err !== null) reject(err);
else resolve(data);
});
});
}
С помощью deferreds вы можете сделать следующее (давайте использовать Q для этого примера, хотя Q теперь поддерживает новый синтаксис, который вы должны предпочесть):
function getStuffAsync(param) {
var d = Q.defer();
getStuff(param, function(err, data) {
if (err !== null) d.reject(err);
else d.resolve(data);
});
return d.promise;
}
В общем случае не следует слишком много обещать вручную, в большинстве библиотек обещаний, которые были разработаны с учетом Node, а также в собственных обещаниях в Node 8+ есть встроенный метод для обещания обратных узлов. Например
var getStuffAsync = Promise.promisify(getStuff); // Bluebird
var getStuffAsync = Q.denodeify(getStuff); // Q
var getStuffAsync = util.promisify(getStuff); // Native promises, node only
4. Целая библиотека с обратными вызовами в стиле узла:
Здесь нет золотого правила, вы обещаете их одно за другим. Тем не менее, некоторые реализации обещаний позволяют вам делать это массово, например, в Bluebird, преобразование API-интерфейса nodeback в API обещаний так же просто, как:
Promise.promisifyAll(API);
Или с нативными обещаниями в Node:
const { promisify } = require('util');
const promiseAPI = Object.entries(API).map(([key, v]) => ({key, fn: promisify(v)}))
.reduce((o, p) => Object.assign(o, {[p.key]: p.fn}), {});
Заметки:
- Конечно, когда вы находитесь в обработчике
.then
вам не нужно ничего обещать. Возвращение обещания от обработчика .then
разрешит или отклонит значение этого обещания. Бросок из обработчика .then
также является хорошей практикой и отвергнет обещание - это известная безопасность броска обещания. - В случае реальной
onload
вы должны использовать addEventListener
а не onX
.
Ответ 2
Сегодня я могу использовать Promise
в Node.js
как простой метод Javascript.
Простой и простой пример для Promise
(с KISS way):
Простой Javascript Async API-код:
function divisionAPI (number, divider, successCallback, errorCallback) {
if (divider == 0) {
return errorCallback( new Error("Division by zero") )
}
successCallback( number / divider )
}
Код API Promise
Javascript Async:
function divisionAPI (number, divider) {
return new Promise(function (fulfilled, rejected) {
if (divider == 0) {
return rejected( new Error("Division by zero") )
}
fulfilled( number / divider )
})
}
(Я рекомендую посетить этот прекрасный источник)
Кроме того, Promise
можно использовать вместе с async\await
в ES7
чтобы заставить поток программы ожидать fullfiled
результата, как ES7
ниже:
function getName () {
return new Promise(function (fulfilled, rejected) {
var name = "John Doe";
// wait 3000 milliseconds before calling fulfilled() method
setTimeout (
function() {
fulfilled( name )
},
3000
)
})
}
async function foo () {
var name = await getName(); // awaits for a fulfilled result!
console.log(name); // the console writes "John Doe" after 3000 milliseconds
}
foo() // calling the foo() method to run the code
Другое использование с тем же кодом с использованием метода .then()
function getName () {
return new Promise(function (fulfilled, rejected) {
var name = "John Doe";
// wait 3000 milliseconds before calling fulfilled() method
setTimeout (
function() {
fulfilled( name )
},
3000
)
})
}
// the console writes "John Doe" after 3000 milliseconds
getName().then(function(name){ console.log(name) })
Promise
также может быть использован на любой платформе, основанной на Node.js, например react-native
.
Бонус: гибридный метод
(Предполагается, что метод обратного вызова имеет два параметра как ошибка и результат)
function divisionAPI (number, divider, callback) {
return new Promise(function (fulfilled, rejected) {
if (divider == 0) {
let error = new Error("Division by zero")
callback && callback( error )
return rejected( error )
}
let result = number / divider
callback && callback( null, result )
fulfilled( result )
})
}
Вышеупомянутый метод может ответить на результат для старого способа обратного вызова и обещаний использования.
Надеюсь это поможет.
Ответ 3
Перед преобразованием функции в качестве обещания в Node.JS
var request = require('request'); //http wrapped module
function requestWrapper(url, callback) {
request.get(url, function (err, response) {
if (err) {
callback(err);
}else{
callback(null, response);
}
})
}
requestWrapper(url, function (err, response) {
console.log(err, response)
})
После преобразования
var request = require('request');
function requestWrapper(url) {
return new Promise(function (resolve, reject) { //returning promise
request.get(url, function (err, response) {
if (err) {
reject(err); //promise reject
}else{
resolve(response); //promise resolve
}
})
})
}
requestWrapper('http://localhost:8080/promise_request/1').then(function(response){
console.log(response) //resolve callback(success)
}).catch(function(error){
console.log(error) //reject callback(failure)
})
Incase вам нужно обработать несколько запросов
var allRequests = [];
allRequests.push(requestWrapper('http://localhost:8080/promise_request/1'))
allRequests.push(requestWrapper('http://localhost:8080/promise_request/2'))
allRequests.push(requestWrapper('http://localhost:8080/promise_request/5'))
Promise.all(allRequests).then(function (results) {
console.log(results);//result will be array which contains each promise response
}).catch(function (err) {
console.log(err)
});
Ответ 4
Я не думаю, что предложение window.onload
от @Benjamin будет работать все время, так как оно не обнаруживает, вызвано ли оно после загрузки. Меня это укусили много раз. Вот версия, которая всегда должна работать:
function promiseDOMready() {
return new Promise(function(resolve) {
if (document.readyState === "complete") return resolve();
document.addEventListener("DOMContentLoaded", resolve);
});
}
promiseDOMready().then(initOnLoad);
Ответ 5
В кандидате на выпуск Node.js 8.0.0 появилась новая утилита util.promisify
(я написал о util.promisify), который инкапсулирует способность обещать любую функцию.
Он мало чем отличается от подходов, предложенных в других ответах, но имеет то преимущество, что он является основным методом и не требует дополнительных зависимостей.
const fs = require('fs');
const util = require('util');
const readFile = util.promisify(fs.readFile);
Затем у вас есть метод readFile
, который возвращает родной Promise
.
readFile('./notes.txt')
.then(txt => console.log(txt))
.catch(...);
Ответ 6
Node.js 8.0.0 включает новый API util.promisify()
который позволяет util.promisify()
стандартные API стиля обратного вызова Node.js в функцию, которая возвращает Promise. Пример использования util.promisify()
показан ниже.
const fs = require('fs');
const util = require('util');
const readFile = util.promisify(fs.readFile);
readFile('/some/file')
.then((data) => { /** ... **/ })
.catch((err) => { /** ... **/ });
См. Улучшенная поддержка для обещаний
Ответ 7
Вы можете использовать встроенный JavaScript promises с Node JS.
My Cloud 9 code link: https://ide.c9.io/adx2803/native-promises-in-node
/**
* Created by dixit-lab on 20/6/16.
*/
var express = require('express');
var request = require('request'); //Simplified HTTP request client.
var app = express();
function promisify(url) {
return new Promise(function (resolve, reject) {
request.get(url, function (error, response, body) {
if (!error && response.statusCode == 200) {
resolve(body);
}
else {
reject(error);
}
})
});
}
//get all the albums of a user who have posted post 100
app.get('/listAlbums', function (req, res) {
//get the post with post id 100
promisify('http://jsonplaceholder.typicode.com/posts/100').then(function (result) {
var obj = JSON.parse(result);
return promisify('http://jsonplaceholder.typicode.com/users/' + obj.userId + '/albums')
})
.catch(function (e) {
console.log(e);
})
.then(function (result) {
res.end(result);
})
})
var server = app.listen(8081, function () {
var host = server.address().address
var port = server.address().port
console.log("Example app listening at http://%s:%s", host, port)
})
//run webservice on browser : http://localhost:8081/listAlbums
Ответ 8
Библиотека Q от kriskowal включает функции обратного вызова к обещанию.
Метод, подобный этому:
obj.prototype.dosomething(params, cb) {
...blah blah...
cb(error, results);
}
можно преобразовать с помощью Q.ninvoke
Q.ninvoke(obj,"dosomething",params).
then(function(results) {
});
Ответ 9
В node v7.6 +, который построил в promises и async:
// promisify.js
let promisify = fn => (...args) =>
new Promise((resolve, reject) =>
fn(...args, (err, result) => {
if (err) return reject(err);
return resolve(result);
})
);
module.exports = promisify;
Как использовать:
let readdir = require('fs').readdir;
let promisify = require('./promisify');
let readdirP = promisify(readdir);
async function myAsyncFn(path) {
let entries = await readdirP(path);
return entries;
}
Ответ 10
Если у вас есть несколько функций, которые выполняют обратный вызов, и вы хотите, чтобы они вернули обещание, вы можете использовать эту функцию для преобразования.
function callbackToPromise(func){
return function(){
// change this to use what ever promise lib you are using
// In this case i'm using angular $q that I exposed on a util module
var defered = util.$q.defer();
var cb = (val) => {
defered.resolve(val);
}
var args = Array.prototype.slice.call(arguments);
args.push(cb);
func.apply(this, args);
return defered.promise;
}
}
Ответ 11
С обычным старым javaScript ванили, вот решение, чтобы обещать обратный вызов api.
function get(url, callback) {
var xhr = new XMLHttpRequest();
xhr.open('get', url);
xhr.addEventListener('readystatechange', function () {
if (xhr.readyState === 4) {
if (xhr.status === 200) {
console.log('successful ... should call callback ... ');
callback(null, JSON.parse(xhr.responseText));
} else {
console.log('error ... callback with error data ... ');
callback(xhr, null);
}
}
});
xhr.send();
}
/**
* @function promisify: convert api based callbacks to promises
* @description takes in a factory function and promisifies it
* @params {function} input function to promisify
* @params {array} an array of inputs to the function to be promisified
* @return {function} promisified function
* */
function promisify(fn) {
return function () {
var args = Array.prototype.slice.call(arguments);
return new Promise(function(resolve, reject) {
fn.apply(null, args.concat(function (err, result) {
if (err) reject(err);
else resolve(result);
}));
});
}
}
var get_promisified = promisify(get);
var promise = get_promisified('some_url');
promise.then(function (data) {
// corresponds to the resolve function
console.log('successful operation: ', data);
}, function (error) {
console.log(error);
});
Ответ 12
В Node.js 8 вы можете promisify использовать методы объекта на лету, используя этот модуль npm:
https://www.npmjs.com/package/doasync
Он использует util.promisify и Прокси, чтобы ваши объекты оставались неизменными. Memoization также выполняется с использованием WeakMaps). Вот несколько примеров:
С объектами:
const fs = require('fs');
const doAsync = require('doasync');
doAsync(fs).readFile('package.json', 'utf8')
.then(result => {
console.dir(JSON.parse(result), {colors: true});
});
С функциями:
doAsync(request)('http://www.google.com')
.then(({body}) => {
console.log(body);
// ...
});
Вы можете даже использовать native call
и apply
для привязки некоторого контекста:
doAsync(myFunc).apply(context, params)
.then(result => { /*...*/ });
Ответ 13
В ES6 вы можете использовать встроенное обещание, например, для использования setTimeout:
enqueue(data) {
const queue = this;
// returns the Promise
return new Promise(function (resolve, reject) {
setTimeout(()=> {
queue.source.push(data);
resolve(queue); //call native resolve when finish
}
, 10); // resolve() will be called in 10 ms
});
}
В этом примере обещание не имеет причин для отказа, поэтому reject()
никогда не вызывается.
Ответ 14
Функция callback style всегда нравится (почти вся функция в node.js - это стиль):
//fs.readdir(path[, options], callback)
fs.readdir('mypath',(err,files)=>console.log(files))
Этот стиль имеет такую же особенность:
Итак, вы можете написать функцию для преобразования функции с таким стилем, как это:
const R =require('ramda')
/**
* A convenient function for handle error in callback function.
* Accept two function res(resolve) and rej(reject) ,
* return a wrap function that accept a list arguments,
* the first argument as error, if error is null,
* the res function will call,else the rej function.
* @param {function} res the function which will call when no error throw
* @param {function} rej the function which will call when error occur
* @return {function} return a function that accept a list arguments,
* the first argument as error, if error is null, the res function
* will call,else the rej function
**/
const checkErr = (res, rej) => (err, ...data) => R.ifElse(
R.propEq('err', null),
R.compose(
res,
R.prop('data')
),
R.compose(
rej,
R.prop('err')
)
)({err, data})
/**
* wrap the callback style function to Promise style function,
* the callback style function must restrict by convention:
* 1. the function must put the callback function where the last of arguments,
* such as (arg1,arg2,arg3,arg...,callback)
* 2. the callback function must call as callback(err,arg1,arg2,arg...)
* @param {function} fun the callback style function to transform
* @return {function} return the new function that will return a Promise,
* while the origin function throw a error, the Promise will be Promise.reject(error),
* while the origin function work fine, the Promise will be Promise.resolve(args: array),
* the args is which callback function accept
* */
const toPromise = (fun) => (...args) => new Promise(
(res, rej) => R.apply(
fun,
R.append(
checkErr(res, rej),
args
)
)
)
Для более кратким приведенным выше примером используется ramda.js. Ramda.js - отличная библиотека для функционального программирования. В приведенном выше коде мы использовали применить (например, javascript function.prototype.apply
) и добавить (например, javascript function.prototype.push
).
Итак, мы можем преобразовать функцию стиля обратного вызова, чтобы обещать функцию стиля сейчас:
const {readdir} = require('fs')
const readdirP = toPromise(readdir)
readdir(Path)
.then(
(files) => console.log(files),
(err) => console.log(err)
)
toPromise и checkErr функция принадлежит berserk, она библиотеку функциональных программных библиотек ramda.js (создайте меня).
Надеюсь, что этот ответ вам полезен.
Ответ 15
Вы можете сделать что-то подобное
// @flow
const toPromise = (f: (any) => void) => {
return new Promise<any>((resolve, reject) => {
try {
f((result) => {
resolve(result)
})
} catch (e) {
reject(e)
}
})
}
export default toPromise
Затем используйте его
async loadData() {
const friends = await toPromise(FriendsManager.loadFriends)
console.log(friends)
}
Ответ 16
es6-promisify
преобразует функции на основе обратного вызова в функции на основе Promise.
const promisify = require('es6-promisify');
const promisedFn = promisify(callbackedFn, args);
Ссылка: https://www.npmjs.com/package/es6-promisify
Ответ 17
Моя обещающая версия функции callback
- это функция P
:
var P = function() {
var self = this;
var method = arguments[0];
var params = Array.prototype.slice.call(arguments, 1);
return new Promise((resolve, reject) => {
if (method && typeof(method) == 'function') {
params.push(function(err, state) {
if (!err) return resolve(state)
else return reject(err);
});
method.apply(self, params);
} else return reject(new Error('not a function'));
});
}
var callback = function(par, callback) {
var rnd = Math.floor(Math.random() * 2) + 1;
return rnd > 1 ? callback(null, par) : callback(new Error("trap"));
}
callback("callback", (err, state) => err ? console.error(err) : console.log(state))
callback("callback", (err, state) => err ? console.error(err) : console.log(state))
callback("callback", (err, state) => err ? console.error(err) : console.log(state))
callback("callback", (err, state) => err ? console.error(err) : console.log(state))
P(callback, "promise").then(v => console.log(v)).catch(e => console.error(e))
P(callback, "promise").then(v => console.log(v)).catch(e => console.error(e))
P(callback, "promise").then(v => console.log(v)).catch(e => console.error(e))
P(callback, "promise").then(v => console.log(v)).catch(e => console.error(e))
Ответ 18
Вы можете использовать модуль await-to-js из npm, который возвращает обещание. https://www.npmjs.com/package/await-to-js
Ответ 19
Вы можете использовать callback2Promise пакет npm для преобразования функций стиля node в Promises.
var c2p = require('callback2promise');
// ordinary function with any number of parameters and a callback at the end
var nodeStyleFunc = function(param1, param2, callback){
setTimeout(
function(){
callback(null, 'done')
}, 200);
}
// convert the function to a promise
var promise = c2p(nodeStyleFunc)(param1, param2);
promise
.then(result => console.log(result))
.catch(err => console.log(err));
Ответ 20
Я создал универсальную функцию, которую я могу использовать повторно.
const wrapIntoPromise: (fnToExecute) => {
return new Promise((resolve, reject) => {
return fnToExecute(resolve, reject);
});
}
//example
async function run() {
await wrapIntoPromise((resolve, reject) => {
/*execute any function here with callbacks etc
when done just call return resolve(valueToReturn)
*/
return backup({
callback: function() { return resolve()}
});
});
}
Ответ 21
Ниже приведена реализация того, как функция (API обратного вызова) может быть преобразована в обещание.
function promisify(functionToExec) {
return function() {
var array = Object.values(arguments);
return new Promise((resolve, reject) => {
array.push(resolve)
try {
functionToExec.apply(null, array);
} catch (error) {
reject(error)
}
})
}
}
// USE SCENARIO
function apiFunction (path, callback) { // Not a promise
// Logic
}
var promisedFunction = promisify(apiFunction);
promisedFunction('path').then(()=>{
// Receive the result here (callback)
})
// Or use it with await like this
let result = await promisedFunction('path');
Ответ 22
Это на 5 лет позже, но я хотел опубликовать здесь мою версию с промыслами, которая берет функции из API обратных вызовов и превращает их в обещания
const promesify = fn => {
return (...params) => ({
then: cbThen => ({
catch: cbCatch => {
fn(...params, cbThen, cbCatch);
}
})
});
};
Посмотрите на эту очень простую версию здесь: https://gist.github.com/jdtorregrosas/aeee96dd07558a5d18db1ff02f31e21a