Thứ hai, 31/10/2016 | 00:00 GMT+7

Hứa hẹn trong JavaScript với ES6 / ES2015


Hứa hẹn là một tính năng mới trong đặc tả JavaScript ES6 (ES2015) cho phép bạn xử lý rất dễ dàng với mã không đồng bộ mà không cần giải quyết nhiều cấp hàm gọi lại. Tạm biệt địa ngục gọi lại!

Đây là cách ta tuyên bố một lời hứa cơ bản. Dưới đây, bạn thường gọi một cái gì đó không đồng bộ như API bên ngoài chẳng hạn. Ở đây ta đang mô phỏng với một hàm setTimeout:

let myPromise = new Promise((resolve, reject) => {
  let data;
  setTimeout(() => {
    data = "Some payload";

if (data) {
  resolve(data);
} else {
  reject();
}

Lưu ý cách một lời hứa mới được bắt đầu với hai hàm làm đối số, một hàm cho sự thành công và một hàm cho sự thất bại của nó. Và đây là cách bạn gọi lời hứa để lấy dữ liệu trọng tải từ nó:

myPromise.then(data => {
  console.log('Received: ' + data);
}).catch(() => {
  console.log("There was an error");
});

Ở trên sẽ ghi lại những điều sau tại console :

Received: Some payload

Nếu không có dữ liệu nào được nhận, thay vào đó, thông tin sau sẽ được ghi lại:

There was an error

Chuỗi lời hứa

Các lời hứa cũng có thể được xâu chuỗi với nhau bằng nhiều hàm then . Giá trị trả về của một sau đó trở thành giá trị có sẵn cho người tiếp theo sau đó trong chuỗi:

myPromise.then(data => {
  console.log('Received: ' + data);
  let moreData = "Another payload";
  return moreData;
}).then(data => {
  console.log(data);
}).catch(() => {
  console.log("There was an error");
});

Ở trên sẽ ghi lại những điều sau tại console :

Received: Some payload
Another payload

Tags:

Các tin liên quan

Chữ mẫu trong JavaScript (ES6 / ES2015)
2016-10-11
console.table () trong JavaScript
2016-09-28
console.time () & console.timeEnd () trong JavaScript
2016-09-28
Phương thức chuỗi toLowerCase () và toUpperCase trong JavaScript
2016-08-29
Loại bỏ JavaScript chặn hiển thị với Async và Defer
2016-08-20
Toán tử bậc ba trong JavaScript
2016-08-14
Cách quản lý phụ thuộc JavaScript và CSS Front-End với Bower trên Ubuntu 14.04
2015-08-26