Promise.prototype.finally được giới thiệu từ Google Chrome 63

26/10/2017 — @kcjpop
280 từ — Đọc trong 1 min

Theo tin từ trang Google Developers, Promise.prototype.finally sẽ được hỗ trợ mặc định từ phiên bản V8 v6.3.165+ và Chrome 63+. Phương thức này rất hữu dụng trong trường hợp lập trình viên cần thực thi một tác vụ nào đó trong cả hai trường hợp fulfilled hoặc rejected.

Một ví dụ rất thường gặp là hiển thị biểu tượng quay (loading icon) khi đang lấy dữ liệu từ server bằng AJAX. Khi dữ liệu được lấy thành công, bạn muốn ẩn biểu tượng quay và hiển thị nội dung. Trong trường hợp xảy ra lỗi, bạn cũng muốn ẩn biểu tượng quay và hiển thị thông báo lỗi.

const fetchAndDisplay = ({ url, element }) => {
  showLoadingSpinner()

  fetch(url)
    .then(response => response.text())
    .then(text => {
      element.textContent = text
      hideLoadingSpinner()
    })
    .catch(error => {
      element.textContent = error.message
      hideLoadingSpinner()
    })
}

Như bạn có thể thấy, hàm hideLoadingSpinner() bị trùng lắp trong cả hai trường hợp fulfilledrejected. finally() có thể giúp giải quyết trường hợp này.

const fetchAndDisplay = ({ url, element }) => {
  showLoadingSpinner()

  fetch(url)
    .then(response => response.text())
    .then(text => {
      element.textContent = text
    })
    .catch(error => {
      element.textContent = error.message
    })
    .finally(hideLoadingSpinner)
}

Bằng cách sử dụng finally() bạn có thể tách biệt phần mã xử lý trường hợp thành công/ lỗi với các tác vụ dọn dẹp. Điều này giúp mã nguồn của bạn gọn gàng hơn.

Bạn cũng có thể làm tương tự với async/await.

const fetchAndDisplay = async ({ url, element }) => {
  showLoadingSpinner()
  try {
    const response = await fetch(url)
    const text = await response.text()
    element.textContent = text
  } catch (error) {
    element.textContent = error.message
  } finally {
    hideLoadingSpinner()
  }
}

Bạn thích bài viết này? Đăng ký nhận Bản tin Ehkoo NGAY, để luôn được cập nhật tin tức mới nhất về thế giới front-end nhé!


Bình luận

Đăng ký bản tin

Quá lười để vào ehkoo mỗi ngày? Không sao hết, Ehkoo sẽ gửi bài cho bạn mỗi tuần.

Đảm bảo chất lượng, hứa không bao giờ spam.