Series Callback Javascript: Phần 3 : Async/Await là gì? Khác gì với Promise trong javascript?

Nội dung bài viết

Video học lập trình mỗi ngày

Link toàn bộ Series bài viết:
[Series Callback Javascript] Phần 1: Giới Thiệu Callbacks.

[Series Callback Javascript] - Phần 2: Promise Là Gì? Khi Nào Sử Dụng Promise ?

Series Callback Javascript: Phần 3 : Async/Await Là Gì? Khác Gì Với Promise Trong Javascript?

[ Tự Học Javascript] - Nếu Có Async/Await Rồi Thì Promise Có Còn Lỗi Thời? Không Cần Thiết Dùng Đến Hay Không?


Wow. Khi các bạn đọc đến phần 3 này tôi cá rằng các bạn giờ đây cũng đã hiểu khá sâu về CallBacks trong javascript. Và các bạn cũng đã khá thành thục về callback or promise.

Thật ra, rất lâu rồi các lập trình viên javascript rất khổ sở khi có những nhiệm vụ phải xoay sở với chiều sâu của một func, lúc đó sự lặp lại của calkback là một nỗi kinh hoàng và khổ sở.

Rất may sau đó chúng ta phải nói lời cám ơn tới các nhà phát triển đồng thời cảm ơn promise đã kịp thời xua tan những nỗi kinh hoàng đó. Và chúng thay thế một cách ấn tượng để hầu hết cộng đồng nhanh chóng chuyển sang sử dụng chúng. Cụ thể là Async/await với sự bổ sung tốt hơn nữa zô zô..

Đừng quên hiểu khái niệm callback là gì ở phần 1, và promise là gì ở phần hai nhé các bạn.

-- Phần 1: Callback truyền thống là gì?

-- Phần 2: Promise là gì? 

Ok, chúng ta bây giờ sẽ giới thiệu về Async/await.

1 - Async/await là gì?


Async / Await là một tính năng JavaScript được dự đoán từ lâu, giúp làm việc với các chức năng không đồng bộ thú vị hơn và dễ hiểu hơn nhiều. Nó được xây dựng dựa trên Promise và tương thích với tất cả các API dựa trên Promise hiện có.

Hai từ khoá thôi nhưng vô cùng quan trọng, nó giúp các coder javascript chuyển hướng một cách ngoạn mục trong việc đồng bộ và không đồng bộ.

- Async - Khai báo (async function someName(){...})

+ Tự động chuyển một function thành một Promise()
+ Các chức năng Async cho phép sử dụng await.

- Await - tạm dừng thực thi các chức năng không đồng bộ (var result = await someAsyncCall();)

+ Await chỉ được hoạt động và sử dụng khi có khai báo Async. Không khai báo lỗi ráng chịu.
+ Await nó chỉ hoạt động với Promise chứ không thèm chơi với các function có callback

Ok nhé! Chỉ đơn giản vậy thôi mà hay dữ dằn.

Giờ đi vào ví dụ cụ thể. Tôi sẽ gộp phần 1, phần 2, và phần 3 cung cấp cho các bạn một ví dụ từ callback đến promise và đến async/await.
Nhớ đọc phần 1 và phần 2 rồi mới xem ví dụ này, nếu ko tẩu hoả nhập ma. Không ai chịu trách nhiệm. ^-^  

Phần quan trọng của bài viết có thể bỏ qua các dòng khác nhưng không thể bỏ qua các ví dụ này


callback - Đây chính là dạng callback truyền thống, reo rắc nỗi kinh hoàng cho coders :D


promise - Còn đây chính là promise thần thánh mà tôi đã nói ở phần hai - sử dụng Promise()


Và cuối cùng đây chính là phần 3 về async/await

Qua 3 ví dụ các bạn thấy đó, trong quá trình phát triền js các developers không ngại gian khô để tối ưu hoá một cách triệt để để giúp các coder có thể thực hiện các step một cách dễ dàng trong qua trình xây dựng một dự án. Khai báo một chức năng là async sẽ đảm bảo rằng nó luôn trả về một Promise để bạn không phải lo lắng về điều đó nữa.


Vậy câu hỏi đặt ra ở đây nhé: Nếu có async/await rồi thì Promise có còn lỗi thời? không cần thiết dùng đến hay không? Ở bài tiếp theo tôi sẽ cho các bạn câu trả lời mà hầu hết các LTV đều có thể chưa có câu trả lời rõ ràng hoặc chưa phân biệt được khi nào sử dụng hai loại đó. Và quan trọng hơn là lúc nào sử dụng async/await hay promise để đạt hiệu suất tối ưu.
Mời các bạn đón đọc bài tiếp theo rất thú vị : Nếu có async/await rồi thì Promise có còn lỗi thời? không cần thiết dùng đến hay không?

Link toàn bộ Series bài viết:
[Series Callback Javascript] Phần 1: Giới Thiệu Callbacks.

[Series Callback Javascript] - Phần 2: Promise Là Gì? Khi Nào Sử Dụng Promise ?

Series Callback Javascript: Phần 3 : Async/Await Là Gì? Khác Gì Với Promise Trong Javascript?

[ Tự Học Javascript] - Nếu Có Async/Await Rồi Thì Promise Có Còn Lỗi Thời? Không Cần Thiết Dùng Đến Hay Không?


Tham khảo thêm tại : https://www.toptal.com/javascript/asynchronous-javascript-async-await-tutorial

Có thể bạn đã bị missing