CĂN BẢN
DOM & BOM
XỨ LÝ FORM
JAVASCRIPT TIPS
TUTORIALS
CÁC CHỦ ĐỀ
BÀI MỚI NHẤT
MỚI CẬP NHẬT

Xử lý bất đồng bộ bằng vòng lặp for-await trong JavaScript

Trong lập trình JavaScript, khi làm việc với 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, việc sử dụng vòng lặp for-await là một cách linh hoạt và hiệu quả để xử lý kết quả của các tác vụ này. Trong bài viết này, mình sẽ tìm hiểu cách sử dụng vòng lặp for-await để xử lý các tác vụ bất đồng bộ một cách chi tiết.

test php

banquyen png
Bài viết này được đăng tại freetuts.net, không được copy dưới mọi hình thức.

Vòng lặp for-await trong JavaScript là gì?

Trước hết, hãy hiểu về khái niệm của vòng lặp for-await trong JavaScript.

  • Vòng lặp for-await là một tính năng mới được giới thiệu trong phiên bản ECMAScript 2018 (ES2018). Vòng lặp này được thiết kế đặc biệt để xử lý các tác vụ bất đồng bộ một cách hiệu quả và tiện lợi.
  • Vòng lặp for-await cho phép bạn lặp qua các giá trị từ một AsyncIterable object (đối tượng có thể lặp qua bất đồng bộ) một cách đơn giản và trực tiếp. Các giá trị này thường là kết quả của các hoạt động bất đồng bộ như gọi API, đọc file, hoặc xử lý dữ liệu từ cơ sở dữ liệu.
  • Khi sử dụng vòng lặp for-await, mỗi lần lặp sẽ đợi cho giá trị bất đồng bộ tiếp theo được giải quyết trước khi tiếp tục. Điều này giúp đảm bảo rằng các tác vụ bất đồng bộ được thực hiện theo đúng trình tự và không gây ra sự chặn trở hoặc đợi chờ không cần thiết trong quá trình thực thi mã.

Ví dụ, bạn có thể sử dụng vòng lặp for-await để lặp qua các Promise và xử lý kết quả của chúng một cách tuần tự và linh hoạt.

Ví dụ về vòng lặp for-await

async function processAsyncIterable(asyncIterable) {
    for await (const value of asyncIterable) {
        console.log(value);
    }
}

const asyncIterable = [
    new Promise(resolve => setTimeout(() => resolve(1), 1000)),
    new Promise(resolve => setTimeout(() => resolve(2), 2000)),
    new Promise(resolve => setTimeout(() => resolve(3), 3000))
];

processAsyncIterable(asyncIterable);

Trong ví dụ này, vòng lặp for-await được sử dụng để lặp qua các giá trị từ asyncIterable, mỗi giá trị là kết quả của một Promise.

Bài viết này được đăng tại [free tuts .net]

Sử dụng vòng lặp for-await trong JavaScript

Để sử dụng vòng lặp for-await trong JavaScript, bạn cần có một đối tượng AsyncIterable, có thể là một mảng các promise, một đối tượng generator async, hoặc một đối tượng tạo ra thông qua một phương thức có thể lặp qua bất đồng bộ. Dưới đây là cách sử dụng vòng lặp for-await với một mảng các promise:

// Định nghĩa một async function để thực hiện các tác vụ bất đồng bộ
async function processAsyncIterable(asyncIterable) {
    try {
        // Sử dụng vòng lặp for-await để lặp qua các giá trị bất đồng bộ từ AsyncIterable object
        for await (const value of asyncIterable) {
            console.log(value); // Xử lý giá trị từ mỗi promise
        }
    } catch (error) {
        console.error('Có lỗi xảy ra:', error);
    }
}

// Tạo một mảng các promise
const asyncIterable = [
    new Promise(resolve => setTimeout(() => resolve(1), 1000)),
    new Promise(resolve => setTimeout(() => resolve(2), 2000)),
    new Promise(resolve => setTimeout(() => resolve(3), 3000))
];

// Gọi async function để thực thi vòng lặp
processAsyncIterable(asyncIterable);

Trong ví dụ trên:

  • processAsyncIterable là một async function nhận một AsyncIterable object làm đối số.
  • Vòng lặp for-await được sử dụng để lặp qua các giá trị từ asyncIterable. Mỗi giá trị là kết quả của một promise trong mảng asyncIterable.
  • Vòng lặp này sẽ đợi mỗi promise được giải quyết trước khi tiếp tục vòng lặp.

Kết quả:

z5216070336905 92b64c0ecdc77e46610842e94bdb0907 jpg​​

Kết bài

Với vòng lặp for-await, bạn có thể xử lý dữ liệu từ Stream hoặc Iterator một cách hiệu quả và linh hoạt trong JavaScript. Điều này giúp cho việc xử lý dữ liệu liên tục trở nên dễ dàng hơn và đảm bảo tính ổn định của ứng dụng.

Cùng chuyên mục:

Functional Programming là gì? Tại sao và khi nào bạn nên sử dụng trong JavaScript

Functional Programming là gì? Tại sao và khi nào bạn nên sử dụng trong JavaScript

Những tính năng mới trong ES6+ trong JavaScript

Những tính năng mới trong ES6+ trong JavaScript

4 cách tránh memory leaks trong JavaScript

4 cách tránh memory leaks trong JavaScript

Capturing và bubbling Event trong Javascript

Capturing và bubbling Event trong Javascript

Phân biệt prototype và __proto__ trong JavaScript

Phân biệt prototype và __proto__ trong JavaScript

Cách hoạt động của Event Loop trong JavaScript

Cách hoạt động của Event Loop trong JavaScript

Phương thức bind(), call(), và apply() trong JavaScript

Phương thức bind(), call(), và apply() trong JavaScript

Cách khắc phục lỗi

Cách khắc phục lỗi "hoisting" trong JavaScript

Sử dụng Promise.all và Promise.race để quản lý các Promise trong JavaScript

Sử dụng Promise.all và Promise.race để quản lý các Promise trong JavaScript

Sự khác biệt giữa Promise, Callback và Async/Await trong JavaScript

Sự khác biệt giữa Promise, Callback và Async/Await trong JavaScript

Cách sử dụng Async functions trong JavaScript

Cách sử dụng Async functions trong JavaScript

Hàm String isspace() trong Python

Hàm String isspace() trong Python

Cách tạo số ngẫu nhiên trong Javascript

Cách tạo số ngẫu nhiên trong Javascript

Hướng dẫn cách tạo một số ngẫu nhiên ...

Cách gộp hai object javascript lại với nhau

Cách gộp hai object javascript lại với nhau

Cách lấy chiều dài của object trong Javascript

Cách lấy chiều dài của object trong Javascript

Hướng dẫn giải phương trình bậc 1 bằng Javascript

Hướng dẫn giải phương trình bậc 1 bằng Javascript

Cách dùng nextSibling trong javascript

Cách dùng nextSibling trong javascript

Cách dùng insertAdjacentHTML trong javascript

Cách dùng insertAdjacentHTML trong javascript

Cách dùng innerHTML trong Javascript

Cách dùng innerHTML trong Javascript

Cách dùng insertBefore trong javascript

Cách dùng insertBefore trong javascript

Top