Ưu điểm của promise so với callback là gì?

Promise mang lại nhiều ưu điểm so với việc sử dụng callback trong JavaScript, giúp mã dễ đọc và dễ bảo trì hơn khi xử lý các tác vụ bất đồng bộ. Dưới đây là những ưu điểm chính của Promise so với callback:

1. Giảm thiểu “Callback Hell”

• Callback Hell là hiện tượng các hàm callback lồng nhau quá nhiều, dẫn đến mã phức tạp, khó đọc và khó duy trì.
• Với Promise, bạn có thể sử dụng chaining (.then()), giúp mã tuần tự hơn và tránh lồng nhiều hàm vào bên trong nhau.

Ví dụ với Callback Hell:

asyncOperation1(function(result1) {
    asyncOperation2(result1, function(result2) {
        asyncOperation3(result2, function(result3) {
            // Và tiếp tục ...
        });
    });
});

Ví dụ với Promise:

asyncOperation1()
    .then(result1 => asyncOperation2(result1))
    .then(result2 => asyncOperation3(result2))
    .then(result3 => {
        // Và tiếp tục ...
    });

2. Xử lý lỗi rõ ràng hơn

• Với callback, xử lý lỗi có thể phức tạp, đặc biệt khi có nhiều tầng callback lồng nhau, vì lỗi có thể phát sinh ở bất kỳ điểm nào.
• Promise cung cấp cơ chế .catch() để xử lý lỗi dễ dàng và nhất quán. Bất kỳ lỗi nào xảy ra trong chuỗi .then() sẽ được bắt bởi .catch() mà không cần phải xử lý từng lỗi trong từng callback.

Callback với lỗi:

asyncOperation1(function(err, result1) {
    if (err) {
        // Xử lý lỗi
    } else {
        asyncOperation2(result1, function(err, result2) {
            if (err) {
                // Xử lý lỗi
            } else {
                // Tiếp tục ...
            }
        });
    }
});

Promise với lỗi:

asyncOperation1()
    .then(result1 => asyncOperation2(result1))
    .then(result2 => asyncOperation3(result2))
    .catch(error => {
        console.error("Lỗi xảy ra:", error);
    });

3. Kết hợp nhiều Promise dễ dàng hơn

• Promise có các phương thức tiện dụng như Promise.all(), Promise.race(), giúp thực hiện nhiều tác vụ bất đồng bộ cùng lúc một cách dễ dàng.
• Với callback, bạn phải xử lý thủ công việc kết hợp nhiều hàm callback để đảm bảo tất cả đều hoàn thành trước khi thực hiện hành động tiếp theo.

Với Promise:

Promise.all([asyncOperation1(), asyncOperation2()])
    .then(([result1, result2]) => {
        console.log(result1, result2);
    });

4. Mã tuần tự, dễ đọc hơn

• Promise giúp mã dễ đọc và tuần tự hơn, vì bạn có thể xử lý từng bước một với .then(). Điều này giúp logic rõ ràng và không gây rối như khi lồng callback.

Callback truyền thống:

asyncOperation1(function(result1) {
    asyncOperation2(result1, function(result2) {
        asyncOperation3(result2, function(result3) {
            console.log(result3);
        });
    });
});

Promise:

asyncOperation1()
    .then(result1 => asyncOperation2(result1))
    .then(result2 => asyncOperation3(result2))
    .then(result3 => console.log(result3));

5. Hỗ trợ tự động chuyển trạng thái

• Một Promise có ba trạng thái chính: Pending, Resolved, và Rejected. Sau khi được giải quyết (resolved) hoặc bị từ chối (rejected), trạng thái của Promise không thay đổi. Điều này đảm bảo tính bất biến (immutability) và tránh các lỗi không mong muốn khi sử dụng callback.
• Với callback, nếu không được quản lý tốt, trạng thái có thể bị thay đổi ngoài ý muốn.

Tóm tắt

• Promise giúp tránh “Callback Hell”, làm cho mã dễ đọc hơn.
• Cơ chế xử lý lỗi thống nhất với .catch().
• Dễ dàng kết hợp và xử lý nhiều tác vụ bất đồng bộ với Promise.all() hoặc Promise.race().
• Cấu trúc mã tuần tự và dễ duy trì hơn.
• Đảm bảo trạng thái bất biến của tác vụ bất đồng bộ.

Nhờ các ưu điểm này, Promise thường được ưa chuộng hơn so với callback trong lập trình JavaScript hiện đại.

• Javascript