如果你还是一个 JavaScript 初学者,你可能要纠结一下 Lời hứa 到底是什么。
最近我发了一条推特,描述了这个问题,我被大家的反馈震惊到了。所以我决定写一篇关事的
我 看 很多 关于 的 , , 大部分 教程 没有 的 的 的 的 的 方式 清楚 到底 到底 是 什么。 搞 , , , 如何复杂的场景中使用它。
因此 在 , , , 通过 一 来 来 来 来 来 来 也 也 会 会 一些 示例 来 说明 在 中
什么是 Promise
想象一下,你准备面试某个公司的前端工程师。
你走进面试会场,当面试马上要开始时你发现简历忘带了,这时你怎么办?
你没有气馁。因为你很幸运,你有一个室友。
你马上给室友打电话寻求帮助,恳求室友帮你找到简历。你的室友承诺他一旦找到就立马回你消息。
假设简历被找到,室友给你回复信息:
“Cùng với nhau, không còn nữa!”
但是 室友 , 就 要 条 , , , 解释 没有 没有 没有 简历 简历。 , , , , , ,
“Không có gì thay đổi, không có gì thay đổi, không có gì thay đổi cả.”
与此同时,面试还要继续。但面试官并没有拿到真实的简历,而是得到一个正在找简历的承诺,同时面试官把该简历的态设置成进行中(PENDING)。
你回答了所有问题。但不幸的是,能否得到这个工作还要依赖你简历的最终状态(FINAL STATUS)。
你 的 回。 正 , , , , , , , , , , , 就 需要 发 一 个 个 个 个
如果是这种情况,面试结束,你被 拒绝(Từ chối) 了。
如果室友找到了简历,他会很高兴的告诉你他找到了,而你将继续面试,并 获得(FULLILL) 这份工作。
如何把上述过程翻译成 JS 代码
室友 室友 室友 室友 室友 室友 室友 我们 中 定义 一 一 , 返回 返回 会 会 会 会 会 会
Hứa hẹn
基于这个原因,在找的这个时间里,面试官并不是什么都没做,是基于简历一会儿就找到的承诺,他们依然开始面试候选人。在这个场景里,我们用简历一会儿就找到的承诺替换了真实的简历。
同理,JS 引擎也并不是等着什么也不做,而是继续执行后续代码,并将返回的Promise对象状态设置为 Chưa giải quyết。
回复信息包含是否找到简历的状态信息。对于Promise对象来说,回复信息被称作返回值。
如果回复信息是 “thành công”,我们将录取候选人。如果是 “thất bại”,我们不录取该候选人。
在 Promise 中,我们通过回调函数处理Promise的返回值。这些处理函数定义在then()
方法中。
为了指定如何调用回调函数,需要使用以下两个方法:
resolve(value)
: 表明 Lời hứa 任务成功,调用then()
的成功回调函数。reject(error)
: 表明 Lời hứa 任务失败,调用then()
的错误回调函数。
如果 Lời hứa 成功,则调用成功回调,如果失败,调用失败回调。
在异步任务完成之前,Lời hứa 只是一个占位符。当你定义了一个 Lời hứa,你并不会立即获得返回值,而是获得一个 Lời hứa 对象。
如何在 JavaScript 中使用 Lời hứa
你可以通过Promise
类定义一个 Lời hứa 对象。
const myPromise = new Promise((resolve, reject) => {
setTimeout(() => {
resolve('this is the eventual value the promise will return');
}, 3000);
});
console.log(myPromise);
示例 1
在控制台运行将返回一个Promise
对象:
除了通过构造函数声明一个 Promise 对象外,还可以使用 Promise 内置的 API 进行声明:
const anotherPromise = Promise.resolve("this is the eventual value the promise will return")
console.log(anotherPromise);
示例 2
示例 1 中的 Promise 等待 3s 后获取到成功返回的信息:this is the eventual...
,而示例 2 中将立即获取到成功返回的信息。
Lời hứa JavaScript 中的错误处理
Lời hứa 对象也能被vật bị loại bỏ。大多数时候,vật bị loại bỏ 的发生是因为执行异步任务的时候抛出了错误,此时就会调用reject()
方法。
下面的示例展示了一个 Hứa 对象是如何执行 từ chối 方法的:
const myPromise = new Promise((resolve, reject) => {
let a = false;
setTimeout(() => {
return (a) ? resolve('a is found!'): reject('sorry, no a');
}, 3000);
});
示例 3
你能想到 Lời hứa 被 bị từ chối 的原因吗?如果你的答案是:a
的值是 sai,那么恭喜你答对了。
在示例3 中,代码执行 3s 后将调用 reject 方法,因为(a)?
表达式的值是 sai,所以触发reject
方法。
Lời hứa 的链式调用
当 Lời hứa 返回了某个值,通常你都会对返回值进行处理。
比如,你发送了一个网络请求,你期望获取数据并展示在页面上。
你可以定义两个回调函数,当 Lời hứa 返回成功或失败时进行回调。这两个回调函数定义在then()
内:
const anotherPromise = new Promise((resolve, reject) => {
setTimeout(() => {
resolve('this is the eventual value the promise will return');
}, 3000);
});
// CONTINUATION
anotherPromise
.then(value => { console.log(value) })
示例 4
示例4 的代码在 3s 后返回成功信息:
原则上你可以无限链式调用,调用链会依次执行,而且前一个 rồi 的返回值作为参数传入后一个 sau đó〪
const anotherPromise = new Promise((resolve, reject) => {
setTimeout(() => {
resolve('this is the eventual value the promise will return');
}, 3000);
});
anotherPromise
.then(fulfillFn, rejectFn)
.then(fulfilFn, rejectFn)
.then(value => { console.log(value) })
示例 5
Bạn sẽ không bao giờ làm điều đó nữa.
要时刻记住,then()
方法必须有两个回调函数:第一个参数是成功回调,第二个参数是错误回调。
在示例4 和示例5 中都没有传入第二个回调函数。因此,如果代码报错,就没有错误回调捕获锂
如果你执意要在then()
中只定义一个回调函数(即成功回调),那么你就需要在 Lời hứa 调用链的末端调用catch()
Bạn có thể làm điều đó với tôi không?
如何在 JS 中使用catch()
方法
在 Lời hứa 调用链上,无论哪个环节报错,catch()
方法都会被调用。
const myPromise = new Promise((resolve, reject) => {
let a = false;
setTimeout(() => {
return (a) ? resolve('a is found!'): reject('sorry, no a');
}, 3000);
});
myPromise
.then(value => { console.log(value) })
.catch(err => { console.log(err) });
示例 6
因为myPromise
最终状态是 bị từ chối,then()
方法中的成功回调被忽略。而catch()
方法中的错误回调被执行,并在控制台打印如下错误信息:
写在最后
JavaScript 中的 Promise 是一个运行异步任务的强大功能。大部分情况下,在前端面试时,面试官都会问一些关䎗面试官都会问一些关䎗
在这片文章中,我已经解释了 Lời hứa 的简单应用场景,也通过示例的方式展示了基本用法。
希望 能 文章 有用 知识 如果 你 , , , , 的 的。 我 会 经常 发布 一些 一些 一些 一些 一些 一些 一些 一些 一些
再次感谢您的阅读,再会。
Tái bút: 如果你也在学习 JavaScript,我也创建了一个电子书,上面有 50 个关于 js 的主题,而且都是我亲手筦瓹~~悘瓂
原文:Lời hứa là gì? Những lời hứa về JavaScript cho người mới bắt đầu,作者:Kingsley Ubah