The secret to wholesale...

In the article about buying Thai goods, I introduced wholesale markets and cheap...

Restaurant business and the...

Customers are a special figure in restaurants. This may seem obvious, but...

Guide the clues to...

Japanese goods Known for putting quality first. However, in the past, due...

Online cosmetics business and...

Starting a business, especially online cosmetics business is the silver trend and...
HomeLập trìnhJavaScriptLời hứa JavaScript

Lời hứa JavaScript


如果你还是一个 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

Đọc thêm  Techniques for raising chickens to lay eggs, an effective way to do business in the countryside

在控制台运行将返回一个Promise对象:

lời hứa-bảng điều khiển-1

除了通过构造函数声明一个 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 后返回成功信息:

SỰ KIỆN-TRẢ LẠI

原则上你可以无限链式调用,调用链会依次执行,而且前一个 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()方法中的错误回调被执行,并在控制台打印如下错误信息:

Đọc thêm  Meme JavaScript hay nhất tôi từng xem, được giải thích chi tiết

Nắm lấy

写在最后

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



Zik.vn – Biên dịch & Biên soạn Lại

spot_img

Create a website from scratch

Just drag and drop elements in a page to get started with Newspaper Theme.

Buy Now ⟶

Bài viết liên quang

DMCA.com Protection Status