Các hàm xử lý chuỗi trong Javascript (cắt / tách / nối chuỗi ..) 
Chia lấy phần dư / chia lấy phần nguyên trong javascript 
Các sự kiện (Event) trong Javascript 
Các cách khai báo biến trong Javascript 
Hướng tạo thanh search bar bằng CSS 
Bắt sự kiện click trong Javascript 
Cách khai báo biến trong PHP, các loại biến thường gặp 
Download và cài đặt Vertrigo Server 
Thẻ li trong HTML 
Thẻ article trong HTML5 
Cấu trúc HTML5: Cách tạo template HTML5 đầu tiên 
Cách dùng thẻ img trong HTML và các thuộc tính của img 
Thẻ a trong HTML và các thuộc tính của thẻ a thường dùng Sự khác biệt giữa Promise, Callback và Async/Await trong JavaScript
Trong lập trình JavaScript, việc xử lý các tác vụ bất đồng bộ là một phần quan trọng của việc phát triển ứng dụng. Ba phương thức phổ biến được sử dụng để xử lý các tác vụ bất đồng bộ là Callback, Promise và Async/Await. Trong bài viết này, mình sẽ tìm hiểu về sự khác biệt giữa chúng và cách sử dụng chúng.
Callback trong JavaScript
Đặc điểm: Callback là một hàm được truyền vào một hàm khác để được gọi lại sau khi một tác vụ bất đồng bộ hoàn thành.
Sử dụng: Callback thường được sử dụng để xử lý các tác vụ bất đồng bộ như gọi API, đọc file, hoặc thao tác với cơ sở dữ liệu.
Ví dụ hàm Callback
// Hàm để tải danh sách người dùng bằng Callback
function loadUsersWithCallback(callback) {
setTimeout(() => {
const users = ['User1', 'User2', 'User3'];
callback(users);
}, 1000);
}
// Sử dụng Callback để hiển thị danh sách người dùng
loadUsersWithCallback(users => {
console.log('Danh sách người dùng (Callback):', users);
});
Hàm loadUsersWithCallback sử dụng Callback để truyền danh sách người dùng vào một hàm gọi lại sau khi tải xong.
Bài viết này được đăng tại [free tuts .net]
Promise trong JavaScript
Đặc điểm: Promise là một đối tượng trong JavaScript được sử dụng để xử lý các tác vụ bất đồng bộ. Nó đại diện cho một giá trị có thể hoàn thành trong tương lai hoặc một lỗi có thể xảy ra khi thực hiện một tác vụ.
Sử dụng: Promise cung cấp một cách tiếp cận linh hoạt hơn và dễ đọc hơn so với Callback. Nó cho phép bạn dễ dàng xác định các hành động sau khi một tác vụ hoàn thành hoặc thất bại.
Ví dụ hàm Promise
// Hàm để tải danh sách người dùng bằng Promise
function loadUsersWithPromise() {
return new Promise((resolve, reject) => {
setTimeout(() => {
const users = ['User1', 'User2', 'User3'];
resolve(users);
}, 1000);
});
}
// Sử dụng Promise để hiển thị danh sách người dùng
loadUsersWithPromise()
.then(users => {
console.log('Danh sách người dùng (Promise):', users);
})
.catch(error => {
console.error('Lỗi:', error);
});
Hàm loadUsersWithPromise trả về một Promise, giúp chúng ta xử lý kết quả sau khi tải xong hoặc xử lý lỗi nếu có.
Async/Await trong JavaScript
Đặc điểm: Async/Await là một cú pháp mới trong JavaScript được sử dụng để viết mã bất đồng bộ một cách dễ đọc hơn và dễ hiểu hơn.
Sử dụng: Async/Await là một cách tiếp cận tiện lợi và mạnh mẽ hơn so với Callback và Promise. Nó cho phép bạn viết mã bất đồng bộ như viết mã đồng bộ thông thường, giúp tránh được callback hell và tạo ra mã dễ đọc và dễ bảo trì hơn.
Ví dụ hàm Async/Await
// Hàm để tải danh sách người dùng bằng Async/Await
async function loadUsersWithAsyncAwait() {
try {
const users = await loadUsersWithPromise();
console.log('Danh sách người dùng (Async/Await):', users);
} catch (error) {
console.error('Lỗi:', error);
}
}
// Gọi hàm Async/Await để hiển thị danh sách người dùng
loadUsersWithAsyncAwait();
Hàm loadUsersWithAsyncAwait sử dụng Async/Await để viết mã bất đồng bộ một cách dễ đọc hơn và dễ hiểu hơn.
So sánh giữa các hàm trong JavaScript
Tính linh hoạt: Callback là cách tiếp cận cổ điển nhưng ít linh hoạt và dễ dẫn đến callback hell. Promise giảm được callback hell và làm cho mã dễ đọc hơn. Async/Await giảm callback hell hoàn toàn và tạo ra mã dễ đọc và dễ hiểu nhất.
Xử lý lỗi: Callback cần phải xử lý lỗi thủ công. Promise cung cấp cơ chế sử dụng catch để xử lý lỗi. Async/Await có thể sử dụng cùng với try/catch để xử lý lỗi.
Độ phổ biến: Async/Await đang trở nên phổ biến hơn trong các dự án JavaScript hiện đại do tính dễ đọc và dễ hiểu của nó, trong khi Callback và Promise vẫn được sử dụng trong các dự án cũ hoặc khi cần tính linh hoạt cao.
Kết bài
Tính từ Callback, Promise đến Async/Await, JavaScript đã cung cấp nhiều cách tiếp cận để xử lý các tác vụ bất đồng bộ. Mỗi cách tiếp cận đều có những ưu điểm và hạn chế riêng, tùy thuộc vào tình huống cụ thể và sở thích cá nhân của bạn. Tuy nhiên, hiện nay, Async/Await đang trở thành phong cách phổ biến nhất và được khuyến khích sử dụng nhiều nhất trong các dự án JavaScript hiện đại.
