Comment convertir une API de rappel existante en promesses?

Je veux travailler avec des promesses mais j'ai une API de rappel dans un format comme:

1. Charge DOM ou autre événement ponctuel:

window.onload; // set to callback
...
window.onload = function() {

};

2. Rappel simple:

function request(onChangeHandler) {
    ...
}
request(function() {
    // change happened
    ...
});

3. Rappel de style de nœud ("nodeback"):

function getStuff(dat, callback) {
    ...
}
getStuff("dataParam", function(err, data) {
    ...
})

4. Toute une bibliothèque avec des rappels de style nœud:

API;
API.one(function(err, data) {
    API.two(function(err, data2) {
        API.three(function(err, data3) {
            ...
        });
    });
});

Comment utiliser l'API dans les promesses, comment la "promettre"?

Les promesses ont un statut, elles commencent comme en suspens et peuvent se régler pour:

• remplie, ce qui signifie que le calcul s'est terminé avec succès.
• rejeté, ce qui signifie que le calcul a échoué.

Les fonctions de retour de promesse ne devraient jamais être lancées , elles devraient plutôt renvoyer les rejets. Le fait de quitter une fonction de retour de promesse vous obligera à utiliser à la fois a } catch { et a .catch. Les personnes utilisant des API promises ne s'attendent pas à ce que des promesses soient lancées. Si vous n'êtes pas sûr du fonctionnement des API asynchrones dans JS, veuillez d'abord lire cette réponse .

1. Charge DOM ou autre événement ponctuel:

Donc, créer des promesses signifie généralement spécifier quand ils s'installent - cela signifie quand ils passent à la phase remplie ou rejetée pour indiquer que les données sont disponibles (et accessibles avec .then).

Avec des implémentations de promesses modernes qui prennent en charge le Promiseconstructeur comme les promesses natives d'ES6:

function load() {
    return new Promise(function(resolve, reject) {
        window.onload = resolve;
    });
}

Vous utiliseriez alors la promesse résultante comme ceci:

load().then(function() {
    // Do things after onload
});

Avec les bibliothèques qui prennent en charge différé (utilisons $ q pour cet exemple ici, mais nous utiliserons également jQuery plus tard):

function load() {
    var d = $q.defer();
    window.onload = function() { d.resolve(); };
    return d.promise;
}

Ou avec une API comme jQuery, accrocher un événement qui se produit une fois:

function done() {
    var d = $.Deferred();
    $("#myObject").once("click",function() {
        d.resolve();
    });
    return d.promise();
}

2. Rappel simple:

Ces API sont plutôt courantes car bon… les rappels sont courants dans JS. Regardons le cas commun d'avoir onSuccesset onFail:

function getUserData(userId, onLoad, onFail) { …

Avec des implémentations de promesses modernes qui prennent en charge le Promiseconstructeur comme les promesses natives d'ES6:

function getUserDataAsync(userId) {
    return new Promise(function(resolve, reject) {
        getUserData(userId, resolve, reject);
    });
}

Avec les bibliothèques qui prennent en charge différé (utilisons jQuery pour cet exemple ici, mais nous avons également utilisé $ q ci-dessus):

function getUserDataAsync(userId) {
    var d = $.Deferred();
    getUserData(userId, function(res){ d.resolve(res); }, function(err){ d.reject(err); });
    return d.promise();
}

jQuery propose également un $.Deferred(fn)formulaire, qui a l'avantage de nous permettre d'écrire une expression qui émule de très près le new Promise(fn)formulaire, comme suit:

function getUserDataAsync(userId) {
    return $.Deferred(function(dfrd) {
        getUserData(userId, dfrd.resolve, dfrd.reject);
    }).promise();
}

Remarque: Ici, nous exploitons le fait qu'un jQuery différé resolveet les rejectméthodes sont "détachables"; c'est à dire. ils sont liés à l' instance d'un jQuery.Deferred (). Toutes les bibliothèques n'offrent pas cette fonctionnalité.

3. Rappel de style de nœud ("nodeback"):

Les rappels de style nœud (nœuds) ont un format particulier où les rappels sont toujours le dernier argument et son premier paramètre est une erreur. Promettons d'abord un manuellement:

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);
        });
    });
}

Avec les reports, vous pouvez effectuer les opérations suivantes (utilisons Q pour cet exemple, bien que Q supporte désormais la nouvelle syntaxe que vous devriez préférer ):

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;   
}

En général, vous ne devez pas trop promettre des choses manuellement, la plupart des bibliothèques de promesses conçues avec Node à l'esprit ainsi que les promesses natives dans Node 8+ ont une méthode intégrée pour promettre les dos de nœud. Par exemple

var getStuffAsync = Promise.promisify(getStuff); // Bluebird
var getStuffAsync = Q.denodeify(getStuff); // Q
var getStuffAsync = util.promisify(getStuff); // Native promises, node only

4. Toute une bibliothèque avec des rappels de style nœud:

Il n'y a pas de règle d'or ici, vous les promettez un par un. Cependant, certaines implémentations de promesse vous permettent de le faire en bloc, par exemple dans Bluebird, la conversion d'une API nodeback en API de promesse est aussi simple que:

Promise.promisifyAll(API);

Ou avec des promesses natives dans 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}), {});

Remarques:

• Bien sûr, lorsque vous êtes dans un .thengestionnaire, vous n'avez pas besoin de promettre des choses. Le renvoi d'une promesse d'un .thengestionnaire résoudra ou rejettera la valeur de cette promesse. Lancer d'un .thengestionnaire est également une bonne pratique et rejettera la promesse - c'est la fameuse promesse de sécurité du lancer.
• Dans un onloadcas réel , vous devez utiliser addEventListenerplutôt que onX.

Aujourd'hui, je peux utiliser Promisein Node.jscomme une simple méthode Javascript.

Un exemple simple et basique pour Promise(avec la méthode KISS ):

Code API Async Javascript simple :

function divisionAPI (number, divider, successCallback, errorCallback) {

    if (divider == 0) {
        return errorCallback( new Error("Division by zero") )
    }

    successCallback( number / divider )

}

Promise Code API 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 )

     })

}

(Je recommande de visiter cette belle source )

PromisePeut également être utilisé avec together async\awaitin ES7pour que le flux de programme attende un fullfiledrésultat comme celui-ci:

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

Une autre utilisation avec le même code en utilisant la .then()méthode

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) })

Promisepeut également être utilisé sur n'importe quelle plate-forme basée sur Node.js comme react-native.

Bonus : une méthode hybride
(la méthode de rappel est supposée avoir deux paramètres comme erreur et résultat)

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 )

     })

}

La méthode ci-dessus peut répondre au résultat pour les utilisations de rappel à l'ancienne et Promise.

J'espère que cela t'aides.

Avant de convertir une fonction en promesse dans 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)
})

Après l'avoir converti

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)
})

Dans le cas où vous devez gérer plusieurs demandes

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)
});

Je ne pense pas que la window.onloadsuggestion de @Benjamin fonctionnera tout le temps, car elle ne détecte pas si elle est appelée après le chargement. J'en ai été mordu plusieurs fois. Voici une version qui devrait toujours fonctionner:

function promiseDOMready() {
    return new Promise(function(resolve) {
        if (document.readyState === "complete") return resolve();
        document.addEventListener("DOMContentLoaded", resolve);
    });
}
promiseDOMready().then(initOnLoad);

Node.js 8.0.0 inclut une nouvelle util.promisify()API qui permet aux API de style de rappel Node.js standard d'être encapsulées dans une fonction qui renvoie une promesse. Un exemple d'utilisation de util.promisify()est illustré ci-dessous.

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

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

readFile('/some/file')
  .then((data) => { /** ... **/ })
  .catch((err) => { /** ... **/ });

Voir Prise en charge améliorée des promesses

Dans la version candidate pour Node.js 8.0.0, il y a un nouvel utilitaire, util.promisify(j'ai écrit sur util.promisify ), qui encapsule la capacité de promettre n'importe quelle fonction.

Elle n'est pas très différente des approches suggérées dans les autres réponses, mais a l'avantage d'être une méthode de base et de ne pas nécessiter de dépendances supplémentaires.

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

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

Ensuite, vous avez une readFileméthode qui renvoie un natif Promise.

readFile('./notes.txt')
  .then(txt => console.log(txt))
  .catch(...);

Vous pouvez utiliser des promesses natives JavaScript avec Node JS.

Lien de code My Cloud 9: 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

Avec le vieux javaScript vanilla, voici une solution pour promettre un rappel 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);
});

La bibliothèque Q de kriskowal comprend des fonctions de rappel à la promesse. Une méthode comme celle-ci:

obj.prototype.dosomething(params, cb) {
  ...blah blah...
  cb(error, results);
}

peut être converti avec Q.ninvoke

Q.ninvoke(obj,"dosomething",params).
then(function(results) {
});

Lorsque vous avez quelques fonctions qui prennent un rappel et que vous souhaitez qu'elles renvoient une promesse, vous pouvez utiliser cette fonction pour effectuer la conversion.

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;
    }
}

Sous le nœud v7.6 + qui a intégré des promesses et asynchrones:

// 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;

Comment utiliser:

let readdir = require('fs').readdir;
let promisify = require('./promisify');
let readdirP = promisify(readdir);

async function myAsyncFn(path) {
    let entries = await readdirP(path);
    return entries;
}

Dans Node.js 8, vous pouvez promettre des méthodes d'objet à la volée en utilisant ce module npm:

https://www.npmjs.com/package/doasync

Il utilise util.promisify et Proxies pour que vos objets restent inchangés. La mémorisation se fait également avec l'utilisation de WeakMaps). Voici quelques exemples:

Avec des objets:

const fs = require('fs');
const doAsync = require('doasync');

doAsync(fs).readFile('package.json', 'utf8')
  .then(result => {
    console.dir(JSON.parse(result), {colors: true});
  });

Avec des fonctions:

doAsync(request)('http://www.google.com')
  .then(({body}) => {
    console.log(body);
    // ...
  });

Vous pouvez même utiliser natif callet applypour lier un certain contexte:

doAsync(myFunc).apply(context, params)
  .then(result => { /*...*/ });

Vous pouvez utiliser Promise native dans ES6, par exemple pour traiter 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
    });

}

Dans cet exemple, la Promesse n'a aucune raison d'échouer, elle reject()n'est donc jamais appelée.

La fonction de style de rappel est toujours comme ça (presque toutes les fonctions dans node.js sont ce style):

//fs.readdir(path[, options], callback)
fs.readdir('mypath',(err,files)=>console.log(files))

Ce style a la même caractéristique:

1. la fonction de rappel est passée par le dernier argument.

2. la fonction de rappel accepte toujours l'objet d'erreur comme premier argument.

Donc, vous pouvez écrire une fonction pour convertir une fonction avec ce style comme ceci:

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
        )
    )
)

Pour un exemple plus concis, ci-dessus utilisé ramda.js. Ramda.js est une excellente bibliothèque pour la programmation fonctionnelle. Dans le code ci-dessus, nous avons utilisé l' appliquer (comme javascript function.prototype.apply) et l'ajouter (comme javascript function.prototype.push). Donc, nous pourrions convertir la fonction de style de rappel en fonction de style de promesse maintenant:

const {readdir} = require('fs')
const readdirP = toPromise(readdir)
readdir(Path)
    .then(
        (files) => console.log(files),
        (err) => console.log(err)
    )

Promouvoir et fonction checkErr appartient à la bibliothèque berserk , c'est une fourchette de bibliothèque de programmation fonctionnelle par ramda.js (créée par moi).

J'espère que cette réponse vous sera utile.

Vous pouvez faire quelque chose comme ça

// @flow

const toPromise = (f: (any) => void) => {
  return new Promise<any>((resolve, reject) => {
    try {
      f((result) => {
        resolve(result)
      })
    } catch (e) {
      reject(e)
    }
  })
}

export default toPromise

Ensuite, utilisez-le

async loadData() {
  const friends = await toPromise(FriendsManager.loadFriends)

  console.log(friends)
}

es6-promisify convertit les fonctions basées sur le rappel en fonctions basées sur Promise.

const promisify = require('es6-promisify');

const promisedFn = promisify(callbackedFn, args);

Réf: https://www.npmjs.com/package/es6-promisify

Ma version promis d'une callbackfonction est la Pfonction:

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))

La Pfonction nécessite que la signature de rappel soit callback(error,result).

Vous trouverez ci-dessous l'implémentation de la façon dont une fonction (API de rappel) peut être convertie en promesse.

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');

C'est comme 5 ans de retard, mais je voulais poster ici ma version promesify qui prend les fonctions de l'API de rappel et les transforme en promesses

const promesify = fn => {
  return (...params) => ({
    then: cbThen => ({
      catch: cbCatch => {
        fn(...params, cbThen, cbCatch);
      }
    })
  });
};

Jetez un œil à cette version très simple ici: https://gist.github.com/jdtorregrosas/aeee96dd07558a5d18db1ff02f31e21a