Ninja IT

Hàm then(), catch()

Hàm then(), catch()

Hàm then() có thể nhận một tham số hoặc hai tham số. Tham số thứ hai là hàm sẽ chạy khi promise nhận trạng thái thất bại. Trạng thái thất bại khi hàm reject() được gọi hoặc một ngoại lệ (Exception) được ném ra.

1

promise.then(successCallback, failureCallback);

tương đương với

1
2
3

promise
  .then(successCallback)
  .catch(failureCallback)

Hàm catch() nhận tham số là hàm sẽ chạy khi promise nhận trạng thái thất bại.

Khi các hàm callBack trả lại các giá trị thì các giá trị này được đẩy vào tham số của các hàm callBack kế tiếp.

Hãy xem ví dụ sau.

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18
19

console.log('Trước khi khởi tạo');

new Promise((resolve, reject) => {
  console.log('Khởi tạo Promise');
  resolve(123);
})
.then((number) => {
  console.log('Số nhận được là ' + number);
  throw new Error('Có một lỗi đã xảy ra');
  console.log('Chạy chỗ này');
})
.catch((errorMessage) => {
  console.error('Catch với tham số lỗi ' + errorMessage);
  return 456;
})
.then((number) => {
  console.log('Số tiếp theo nhận được là ' + number);
});
console.log('Sau khi khởi tạo');

Ví dụ ở trên sẽ in ra

"Trước khi khởi tạo"
"Khởi tạo Promise"
"Sau khi khởi tạo"
"Số nhận được là 123"
"Catch với tham số lỗi Error: Có một lỗi đã xảy ra"
"Số tiếp theo nhận được là 456"

Đầu tiên là các hàm đồng bộ được gọi trước (trong đó có hàm khởi tạo promise). Tiếp theo là các hàm bất đồng bộ được chạy (các hàm là tham số của hàm then(), catch()). Giá trị hàm resolve nhận được sẽ đẩy vào hàm then() tiếp theo.

Một ngoại lệ được ném ra được đẩy xuống ngay cho hàm catch(). Và tiếp theo sau hàm catch(), hàm then() có thể được gọi lại.

Sự kiện với Promise

Các sự kiện với promise được đối tượng window trên trình duyệt quản lý. Hoặc Web Worker trong trường hợp sử dụng Web Worker. Đối với NodeJs thì đó là đối tượng process quản lý.
Sự kiện khi gọi Promise là:

  • unhandledrejection là sự kiện được gọi khi không có hàm reject nào bắt promise khi nó bị reject.
 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15

new Promise((resolve, reject) => {
  reject(123);
});

window.addEventListener("unhandledrejection", event => {
  // event.reason là 123
  console.error('Một reject Promise chưa được bắt');
  console.error('Mã lỗi ' + event.reason)
  console.error('Event', event);

  // bỏ qua các hành động khác khi 
  // reject promise không được bắt
  // ví dụ như in ra thông báo lỗi
  event.preventDefault();
});