栏目分类:
子分类:
返回
名师互学网用户登录
快速导航关闭
当前搜索
当前分类
子分类
实用工具
热门搜索
名师互学网 > IT > 面试经验 > 面试问答

如何将现有的回调API转换为Promise?

面试问答 更新时间: 发布时间: IT归档 最新发布 模块sitemap 名妆网 法律咨询 聚返吧 英语巴士网 伯小乐 网商动力

如何将现有的回调API转换为Promise?

承诺有状态,它们从待定状态开始,可以解决:

  • 完成 意味着计算成功完成。
  • 拒绝 表示计算失败。

承诺返回函数 绝不应该抛出,而应该返回拒绝。从promise返回函数抛出将迫使您同时使用a

} catch {
a
.catch
。使用承诺的API的人们不会期望诺言。

1. DOM加载或其他一次事件:

因此,创建承诺通常意味着指定它们的结算时间-这意味着它们何时进入完成或拒绝阶段以指示数据可用(并且可以通过访问

.then
)。

通过支持

Promise
本地构造函数的现代Promise实现(例如本机ES6 Promise):

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

或使用API​​之类的jQuery,将一次发生的事件挂钩:

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

2.普通回调:

这些API相当常见,因为……在JS中回调很常见。让我们看看具有

onSuccess
and 的常见情况
onFail

function getUserData(userId, onLoad, onFail) { …

通过支持

Promise
本地构造函数的现代Promise实现(例如本机ES6 Promise):

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)
类似于该表单的表达式,如下所示:

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

注意:这里我们利用了jQuery的deferred

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

使用deferred,您可以执行以下操作(在本示例中,请使用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设计的Promise库以及Node
8+中的本机Promise具有内置的用于使NodeBbacks富集的方法。例如

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

4.带有节点样式回调的整个库:

这里没有黄金法则,您一一承诺。但是,某些promise实现允许您批量执行此操作,例如在Bluebird中,将nodeback API转换为promiseAPI很简单:

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


转载请注明:文章转载自 www.mshxw.com
本文地址:https://www.mshxw.com/it/383457.html
我们一直用心在做
关于我们 文章归档 网站地图 联系我们

版权所有 (c)2021-2022 MSHXW.COM

ICP备案号:晋ICP备2021003244-6号