学习 javascript Promise 部分 什么是 Promise?

来源:undefined 2025-01-12 01:19:30 0

深入浅出 javascript promise:第一部分——promise 的本质

大家好,JavaScript 爱好者们!今天,我们将一起探索 JavaScript 中的 Promise,并学习如何更好地理解和使用它。很多人觉得 Promise 复杂难懂,其实不然,只要多加练习,你就能轻松掌握!本文将帮助你理解 Promise 的基础知识,了解其本质以及为何我们需要它。

Promise 是什么?为什么 JavaScript 需要它?

想象一下,你承诺每天早上锻炼,并告知朋友你的锻炼结果。你的承诺本身不会影响你和朋友的生活,朋友只是等待你的通知(承诺成功或失败),以便做出相应的判断或行动。

这个例子阐述了 Promise 作为事件的本质,以及事件连接的两个参与者:消费者(你的朋友)和生产者(你):

立即学习Java免费学习笔记(深入)”;

简而言之,JavaScript 中的 Promise 对象具有类似的行为。它允许我们在不阻塞主线程的情况下执行异步任务,并在任务完成后通知订阅者。

让我们通过一个例子来理解 Promise 的使用方法:

代码解读:

我们使用执行器函数创建一个 Promise 实例(传递给 Promise 构造函数的函数)。执行器函数在 Promise 创建时立即执行。

执行器函数有两个参数:resolve 方法和 reject 方法。这两个方法用于在异步操作完成后完成 Promise。

例如,我们承诺一周内每天早上锻炼。Promise 将持续一周。如果第三天你没有完成锻炼,你可以调用 reject 方法,所有订阅了该 Promise 的人都将收到通知。反之,如果完成了一周的锻炼,你可以在第七天调用 resolve 方法,通知朋友你已成功履行承诺。消费者(你的朋友)无需关心你何时告知结果,他们只需要在收到结果时处理即可。

需要注意的是,Promise 执行器只能完成一次,后续对 resolve 或 reject 的调用将被忽略。

当你完成 Promise(调用 resolve 或 reject)时,所有订阅者都将收到包含有效负载的通知,可以通过 Promise 实例的两个特殊方法访问:Promise.prototype.then 和 Promise.prototype.catch。

Promise.prototype.then 方法可以同时处理成功和失败的情况,因为它接受两个回调函数。

Promise.prototype.catch 方法仅处理失败的情况:

Promise.prototype.then 用于处理成功的情况。

此外,Promise.prototype.finally 方法用于执行无论结果如何都应该执行的代码:

该方法不执行任何操作不返回任何内容,主要用于一些收尾工作,例如向用户显示消息或隐藏加载程序。

接下来,我们来看一个从 API 请求数据、将其转换为 JSON 并输出到控制台的实际例子:

你会发现,实际应用与我们之前的例子并无太大区别。但需要注意以下几点:

每个 Promise.prototype.then 和 Promise.prototype.catch 处理程序的结果都会传递到下一个处理程序。Response.json 方法返回一个 Promise,该 Promise 在执行后返回 JSON 数据,并传递给下一个处理程序。 Promise.prototype.finally 处理程序会将前一个响应传递到下一个响应。

至此,你应该对 Promise 的基础知识有了更深入的理解,包括其使用方法和状态。

总结:

JavaScript Promise 是一个特殊的对象,用于执行异步操作并在完成时通知消费者。 Promise 实例有三种状态:“pending”、“fulfilled”和“rejected”。 Promise 实例有三个主要方法:“then”、“catch”和“finally”。 Promise.prototype.then 用于处理成功和失败的结果。 Promise.prototype.catch 用于处理失败的结果。 Promise.prototype.finally 用于执行一些清理工作。 可以按任意顺序链接处理程序,它们将按顺序执行。 前一个 Promise 的结果会传递到下一个 Promise,为了使 Promise 链可扩展,除了“finally”处理程序外,其他处理程序必须返回一个 Promise。

在接下来的文章中,我们将探讨更高级的 Promise 技术,敬请期待!

以上就是学习 javascript Promise 部分 什么是 Promise?的详细内容,更多请关注php中文网其它相关文章!

最新文章