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?
Đây là phần cuối về Series Callback JavaScript. Rất vui để đi đến với các lập trình js đến tận phần 4 và cũng như phần cuối.
- Ở phần 1 chúng ta đã giới thiệu và giải thích rõ về callback là gì? Và khi nào callback xảy ra? ở phần này hầu như tôi thấy các. Xem thêm phần 1: Callback là gì? Khi nào sử dụng callback? bạn cũng chưa hào hứng lắm bởi vì hầu hết các DEVJS( DEVELOPER JS) cũng đã nắm và gặp rất nhiều trường hợp phải sử dung callback. Nên cũng có ít câu hỏi về phần 1. Ok bypass
- Ở phần 2 Có vẻ hay hơn khi nói về promise một object của javascript giúp đỡ DEVJS control được callback mà giảm bớt thời gian. xem thêm phần 2: promise là gì? sử dụng như thế nào? khi sử dụng hay đụng độ những task liên quan đến Callback. Và cũng chính ở đây có một số bạn lại hỏi: "sao không sử dụng Async/await". Vâng các bạn quả thật không sai khi vào đề luôn haha. Nhưng ở phần 2 này tôi chỉ nói gọn về Promise thôi.
- ở phần 3 Điều gì tới cũng đã tới các nhà phát triển đã cố gắng giúp cộng đồng chúng ta giảm áp lực hơn nhiều khi sử dụng callback, hay promise, khi cung cấp thêm những object mới trong đó có Async.await, Xem thêm phần 3: Làm quen với Async/await trong js ? một object tuyệt diệu.
Nhưng cũng chính vì Async/await mà Promise lại lép vế so với Async/await hay gọi là lỗi thời không? Đó là một câu hỏi khá hay, và tôi cũng khá bất ngờ vì câu hỏi này.
Đúng, hằng ngày chúng ta sử dụng Async/await và promise liên tục. Ngoài lề chút: Khi các devjs cứng cựa sẽ gặp những task mà luôn luôn có callback vì một project không chỉ là một luồng hay gọi là một service mà nó có thể nhúng nhiều server vào đó. A gọi cho B, B gọi C, C trả lời A. Vậy mới đau chứ....
Tiếp câu hỏi đó tôi đã suy nghĩ và cũng đã tìm ra được câu trả lời. Vâng! promise không hề lỗi thời, không hề phai nhạt trong tâm trí người devjs . Tôi thề. Trong quá trình code tôi vấn sử dụng cả hai promise và async/await.
Có những trường hợp tôi không thể sử dụng chúng (async/await) và tôi bắt đầu quay lại nhờ vả một cách thân thiện Pomise().
Để chứng minh vì sao tôi nói vậy thì mời các bạn xem qua ví dụ sau:
Đề bài:
Hãy tìm họ tên F1, F2, F3 của chiếc SH 125i của anh A .
Giải thích: Là bài toán tìm các đời chủ của chiếc xe của anh A. Nghe có vẻ đơn giản nhưng nó đơn giản thật, quan trọng của thuật toán này là tối ưu và performace thôi.
Và tôi sẽ cho các bạn thấy Promise lợi hại thế nào?
Cách 1 : chúng ta sử dụng async/await để giải quyết bài toán sau:
```
async function layChuXe() {
let F1 = await getInfoF1(); // Lay info F1 thong qua F2, F3 mat 4 second
let F2 = await getInfoF2(); // Lay info F2 thong qua F3 mat 3 second
let F3 = await getInfoF3(); // Lay info F3 2 second
return F1 + '-'+ F2 +'-'+ F3; // get info
}
```
Vậy khi muốn có thông tin toàn bộ các chủ xe thì phải tìm chủ đầu tiên rồi mới biết bán cho ai , cứ lần lượt cho nên,
tìm F1 lại tốn thời gian hơn.
Như vậy muốn biết hết thông tin thì layChuXe() tiêu tốn chúng ta (4+3+2) = 9 second. Lúc đó mới return về result. wow
Mất 9 second đó các bạn ạ.
Do đó tôi đã nghĩ ngay tới việc quay lại giờ sự giúp đỡ của Promise().
Cũng bài toán đó tôi sẽ sử dụng Promise.all().
```
async function layChuXe() {
// Promise.all() cho phép request nhiều trong cùng một thời gian
let results = await Promise.all([ getInfoF1, getInfoF2, getInfoF3 ]);
return results.reduce((total,value) => total +'-'+ value);
}
```Và return về result chỉ có 4 second thôi, Quả là không ngờ. Vì các bạn biết đấy, 3 request trên được thực hiện cùng một lúc
cho nên F2, và F3 chỉ đợi F1 chạy xong là return thôi. và chính là 4 second.
Kết luận:
Như vậy tôi đã giải thích cho các bạn biết sự lợi hại như thế nào của promise khi bị lãng quên khi sự có mặt của Async/await.
kết thúc Series ở đây, tôi mong rằng các bạn sẽ hiểu sâu và nắm cú pháp nắm các tình huống để phát hiện và triền khai dự án của
mình một cách hoàn hảo nhất.
Cảm ơn đã đọc bài, nếu thấy hay các bạn nên chia sẻ.
Group JS: https://www.facebook.com/TipJS/
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?
