Khái niệm

Promise là một khái niệm quan trọng và mạnh mẽ để xử lý các tác vụ bất đồng bộ.

Promise giúp chúng ta tạo ra các chuỗi xử lý tuần tự, xử lý lỗi dễ dàng hơn và tăng tính ổn định của ứng dụng. Nó có thể có 3 trạng thái:

• Pending: Trạng thái ban đầu khi Promise được tạo ra.
• Fulfilled: Trạng thái khi tác vụ hoàn thành thành công.
• Rejected: Trạng thái khi tác vụ gặp lỗi.

Promise có thể được xem như một hợp đồng giữa người gửi và người nhận. Người gửi đưa ra một lời hứa (Promise) và người nhận sẽ nhận được kết quả sau khi tác vụ hoàn thành.

Cách sử dụng Promise

Để tạo ra một Promise trong JavaScript, chúng ta sử dụng constructor Promise có cú pháp như sau:

const promise = new Promise((resolve, reject) => {
  // Code xử lý tác vụ bất đồng bộ
});

Trong constructor Promise, chúng ta truyền vào một hàm với hai tham số resolve và reject. resolve được sử dụng để trả về kết quả thành công và reject được sử dụng để trả về lỗi.

Xử lý kết quả của Promise

Sau khi tạo ra một Promise, chúng ta có thể sử dụng các phương thức .then() và .catch() để xử lý kết quả hoặc lỗi của Promise.

Phương thức .then() được sử dụng để xử lý kết quả thành công của Promise. Ví dụ:

promise.then((result) => {
  // Xử lý kết quả thành công
}).catch((error) => {
  // Xử lý lỗi
});

Phương thức .catch() được sử dụng để xử lý lỗi của Promise. Nếu trong quá trình xử lý Promise xảy ra lỗi, phương thức .catch() sẽ được gọi.

Ví dụ về Promise

Dưới đây là một ví dụ đơn giản về cách sử dụng Promise trong JavaScript:

const fetchData = (url) => {
  return new Promise((resolve, reject) => {
    // Mô phỏng việc gửi request tới server
    setTimeout(() => {
      const data = { name: "John Doe", age: 25 };
      resolve(data);
    }, 2000);
  });
};

fetchData("https://api.example.com/users")
  .then((data) => {
    console.log(data);
  })
  .catch((error) => {
    console.error(error);
  });

Trong ví dụ trên, hàm fetchData trả về một Promise và mô phỏng việc gửi request tới server. Sau khi tác vụ hoàn thành, Promise sẽ trả về dữ liệu và chúng ta có thể sử dụng phương thức .then() để xử lý kết quả thành công. Nếu có lỗi xảy ra, phương thức .catch() sẽ được gọi để xử lý lỗi.

Promise.all

Promise.all là một phương thức của đối tượng Promise trong JavaScript. Nó cho phép bạn xử lý một mảng các promise cùng một lúc và đợi cho tất cả các promise hoàn thành trước khi tiếp tục thực hiện các tác vụ khác.

Tham khảo ví dụ sau:

// Tạo một hàm trả về promise với thời gian chờ
function delay(ms) {
  return new Promise((resolve) => setTimeout(resolve, ms));
}

// Tạo một mảng chứa các promise
const promises = [
  delay(1000).then(() => "Promise 1 hoàn thành"),
  delay(2000).then(() => "Promise 2 hoàn thành"),
  delay(3000).then(() => "Promise 3 hoàn thành"),
];

// Sử dụng Promise.all để xử lý các promise
Promise.all(promises)
  .then((results) => {
    console.log(results);
    // Kết quả: ["Promise 1 hoàn thành", "Promise 2 hoàn thành", "Promise 3 hoàn thành"]
  })
  .catch((error) => {
    console.log(error);
  });

Trong ví dụ trên, chúng ta tạo ra một hàm delay trả về một promise với thời gian chờ được chỉ định. Sau đó, chúng ta tạo ra một mảng promises chứa ba promise với thời gian chờ khác nhau. Cuối cùng, chúng ta sử dụng Promise.all để xử lý tất cả các promise trong mảng promises và đợi cho tất cả chúng hoàn thành.

Kết quả của Promise.all sẽ trả về một mảng kết quả của các promise đã được giải quyết theo thứ tự ban đầu. Trong ví dụ trên, kết quả sẽ là một mảng chứa ba chuỗi “Promise 1 hoàn thành”, “Promise 2 hoàn thành”, và “Promise 3 hoàn thành”.