Trình lặp bất đồng bộ (Async Iterators) trong JavaScript: Hướng dẫn toàn diện về xử lý luồng dữ liệu

Trong lĩnh vực phát triển JavaScript hiện đại, việc xử lý các luồng dữ liệu bất đồng bộ là một yêu cầu thường xuyên. Dù bạn đang lấy dữ liệu từ một API, xử lý các sự kiện thời gian thực, hay làm việc với các bộ dữ liệu lớn, việc quản lý dữ liệu bất đồng bộ một cách hiệu quả là rất quan trọng để xây dựng các ứng dụng có khả năng phản hồi nhanh và mở rộng. Trình lặp bất đồng bộ (Async Iterators) của JavaScript cung cấp một giải pháp mạnh mẽ và tinh tế để giải quyết những thách thức này.

Async Iterators là gì?

Trình lặp bất đồng bộ là một tính năng JavaScript hiện đại cho phép bạn lặp qua các nguồn dữ liệu bất đồng bộ, chẳng hạn như các luồng hoặc phản hồi API bất đồng bộ, một cách tuần tự và có kiểm soát. Chúng tương tự như các trình lặp thông thường, nhưng với sự khác biệt chính là phương thức next() của chúng trả về một Promise. Điều này cho phép bạn làm việc với dữ liệu đến không đồng bộ mà không chặn luồng chính.

Hãy tưởng tượng một trình lặp thông thường như một cách để lấy các mục từ một bộ sưu tập từng cái một. Bạn yêu cầu mục tiếp theo và nhận được nó ngay lập tức. Mặt khác, một Trình lặp bất đồng bộ giống như việc đặt hàng trực tuyến. Bạn đặt hàng (gọi next()), và một lúc sau, mục tiếp theo sẽ đến (Promise được giải quyết).

Các khái niệm chính

• Trình lặp bất đồng bộ (Async Iterator): Một đối tượng cung cấp phương thức next() trả về một Promise được giải quyết thành một đối tượng có thuộc tính value và done, tương tự như một trình lặp thông thường. value đại diện cho mục tiếp theo trong chuỗi, và done cho biết liệu vòng lặp đã hoàn tất hay chưa.
• Trình tạo bất đồng bộ (Async Generator): Một loại hàm đặc biệt trả về một Trình lặp bất đồng bộ. Nó sử dụng từ khóa yield để tạo ra các giá trị một cách bất đồng bộ.
• Vòng lặp for await...of: Một cấu trúc ngôn ngữ được thiết kế đặc biệt để lặp qua các Trình lặp bất đồng bộ. Nó đơn giản hóa quá trình sử dụng các luồng dữ liệu bất đồng bộ.

Tạo Trình lặp bất đồng bộ với Trình tạo bất đồng bộ

Cách phổ biến nhất để tạo Trình lặp bất đồng bộ là thông qua Trình tạo bất đồng bộ. Một Trình tạo bất đồng bộ là một hàm được khai báo với cú pháp async function*. Bên trong hàm, bạn có thể sử dụng từ khóa yield để tạo ra các giá trị một cách bất đồng bộ.

Ví dụ: Mô phỏng một luồng dữ liệu thời gian thực

Hãy tạo một Trình tạo bất đồng bộ mô phỏng một luồng dữ liệu thời gian thực, chẳng hạn như giá cổ phiếu hoặc chỉ số cảm biến. Chúng ta sẽ sử dụng setTimeout để tạo ra độ trễ nhân tạo và mô phỏng việc dữ liệu đến không đồng bộ.

            async function* generateDataFeed(count) {
  for (let i = 0; i < count; i++) {
    await new Promise(resolve => setTimeout(resolve, 500)); // Simulate delay
    yield { timestamp: Date.now(), value: Math.random() * 100 };
  }
}

            

              
                Copy
              
            
          

Trong ví dụ này:

• async function* generateDataFeed(count) khai báo một Trình tạo bất đồng bộ nhận một đối số count cho biết số lượng điểm dữ liệu cần tạo.
• Vòng lặp for lặp lại count lần.
• await new Promise(resolve => setTimeout(resolve, 500)) tạo ra một độ trễ 500ms bằng cách sử dụng setTimeout. Điều này mô phỏng bản chất bất đồng bộ của việc dữ liệu đến trong thời gian thực.
• yield { timestamp: Date.now(), value: Math.random() * 100 } trả về một đối tượng chứa dấu thời gian và một giá trị ngẫu nhiên. Từ khóa yield tạm dừng việc thực thi của hàm và trả về giá trị cho bên gọi.

Sử dụng Trình lặp bất đồng bộ với for await...of

Để sử dụng một Trình lặp bất đồng bộ, bạn có thể dùng vòng lặp for await...of. Vòng lặp này tự động xử lý bản chất bất đồng bộ của trình lặp, chờ mỗi Promise được giải quyết trước khi chuyển sang lần lặp tiếp theo.

Ví dụ: Xử lý luồng dữ liệu

Hãy sử dụng Trình lặp bất đồng bộ generateDataFeed bằng vòng lặp for await...of và ghi lại mỗi điểm dữ liệu vào console.

            async function processDataFeed() {
  for await (const data of generateDataFeed(5)) {
    console.log(`Received data: ${JSON.stringify(data)}`);
  }
  console.log('Data feed processing complete.');
}

processDataFeed();

            

              
                Copy
              
            
          

Trong ví dụ này:

• async function processDataFeed() khai báo một hàm bất đồng bộ để xử lý dữ liệu.
• for await (const data of generateDataFeed(5)) lặp qua Trình lặp bất đồng bộ được trả về bởi generateDataFeed(5). Từ khóa await đảm bảo rằng vòng lặp sẽ chờ mỗi điểm dữ liệu đến trước khi tiếp tục.
• console.log(`Received data: ${JSON.stringify(data)}`) ghi lại điểm dữ liệu nhận được vào console.
• console.log('Data feed processing complete.') ghi một thông báo cho biết quá trình xử lý luồng dữ liệu đã hoàn tất.

Lợi ích của việc sử dụng Trình lặp bất đồng bộ

Trình lặp bất đồng bộ mang lại nhiều lợi thế so với các kỹ thuật lập trình bất đồng bộ truyền thống, chẳng hạn như callbacks và Promises:

• Cải thiện tính dễ đọc: Trình lặp bất đồng bộ và vòng lặp for await...of cung cấp một cách làm việc với các luồng dữ liệu bất đồng bộ trông giống như đồng bộ hơn và dễ hiểu hơn.
• Xử lý lỗi đơn giản hóa: Bạn có thể sử dụng các khối try...catch tiêu chuẩn để xử lý lỗi trong vòng lặp for await...of, giúp việc xử lý lỗi trở nên đơn giản hơn.
• Xử lý áp suất ngược (Backpressure): Trình lặp bất đồng bộ có thể được sử dụng để triển khai các cơ chế áp suất ngược, cho phép bên tiêu thụ kiểm soát tốc độ sản xuất dữ liệu, ngăn ngừa tình trạng cạn kiệt tài nguyên.
• Khả năng kết hợp: Trình lặp bất đồng bộ có thể dễ dàng được kết hợp và xâu chuỗi với nhau để tạo ra các đường ống dữ liệu phức tạp.
• Khả năng hủy bỏ: Trình lặp bất đồng bộ có thể được thiết kế để hỗ trợ việc hủy bỏ, cho phép bên tiêu thụ dừng quá trình lặp nếu cần.

Các trường hợp sử dụng trong thực tế

Trình lặp bất đồng bộ rất phù hợp cho nhiều trường hợp sử dụng trong thực tế, bao gồm:

• Luồng API (API Streaming): Tiêu thụ dữ liệu từ các API hỗ trợ phản hồi dạng luồng (ví dụ: Server-Sent Events, WebSockets).
• Xử lý tệp: Đọc các tệp lớn theo từng đoạn mà không cần tải toàn bộ tệp vào bộ nhớ. Ví dụ, xử lý một tệp CSV lớn theo từng dòng.
• Luồng dữ liệu thời gian thực: Xử lý các luồng dữ liệu thời gian thực từ các nguồn như sàn giao dịch chứng khoán, nền tảng mạng xã hội, hoặc thiết bị IoT.
• Truy vấn cơ sở dữ liệu: Lặp qua các bộ kết quả lớn từ các truy vấn cơ sở dữ liệu một cách hiệu quả.
• Tác vụ nền: Triển khai các tác vụ nền chạy dài cần được thực thi theo từng đoạn.

Ví dụ: Đọc một tệp lớn theo từng đoạn

Hãy cùng xem cách sử dụng Trình lặp bất đồng bộ để đọc một tệp lớn theo từng đoạn, xử lý mỗi đoạn ngay khi nó có sẵn. Điều này đặc biệt hữu ích khi xử lý các tệp quá lớn để vừa với bộ nhớ.

            const fs = require('fs');
const readline = require('readline');

async function* readLines(filePath) {
  const fileStream = fs.createReadStream(filePath);

  const rl = readline.createInterface({
    input: fileStream,
    crlfDelay: Infinity
  });

  for await (const line of rl) {
    yield line;
  }
}

async function processFile(filePath) {
  for await (const line of readLines(filePath)) {
    // Process each line here
    console.log(`Line: ${line}`);
  }
}

processFile('large_file.txt');

            

              
                Copy
              
            
          

Trong ví dụ này:

• Chúng ta sử dụng các mô-đun fs và readline để đọc tệp theo từng dòng.
• Trình tạo bất đồng bộ readLines tạo một readline.Interface để đọc luồng tệp.
• Vòng lặp for await...of lặp qua các dòng trong tệp, trả về mỗi dòng cho bên gọi.
• Hàm processFile sử dụng Trình lặp bất đồng bộ readLines và xử lý mỗi dòng.

Cách tiếp cận này cho phép bạn xử lý các tệp lớn mà không cần tải toàn bộ tệp vào bộ nhớ, giúp nó hiệu quả và có khả năng mở rộng hơn.

Các kỹ thuật nâng cao

Xử lý Áp suất ngược (Backpressure)

Áp suất ngược là một cơ chế cho phép bên tiêu thụ báo hiệu cho bên sản xuất rằng họ chưa sẵn sàng nhận thêm dữ liệu. Điều này ngăn chặn bên sản xuất làm quá tải bên tiêu thụ và gây cạn kiệt tài nguyên.

Trình lặp bất đồng bộ có thể được sử dụng để triển khai áp suất ngược bằng cách cho phép bên tiêu thụ kiểm soát tốc độ họ yêu cầu dữ liệu từ trình lặp. Bên sản xuất sau đó có thể điều chỉnh tốc độ tạo dữ liệu của mình dựa trên yêu cầu của bên tiêu thụ.

Hủy bỏ (Cancellation)

Hủy bỏ là khả năng dừng một hoạt động bất đồng bộ trước khi nó hoàn thành. Điều này có thể hữu ích trong các tình huống mà hoạt động không còn cần thiết hoặc mất quá nhiều thời gian để hoàn thành.

Trình lặp bất đồng bộ có thể được thiết kế để hỗ trợ việc hủy bỏ bằng cách cung cấp một cơ chế cho bên tiêu thụ báo hiệu cho trình lặp rằng nó nên ngừng sản xuất dữ liệu. Trình lặp sau đó có thể dọn dẹp mọi tài nguyên và kết thúc một cách nhẹ nhàng.

Trình tạo bất đồng bộ so với Lập trình phản ứng (RxJS)

Mặc dù Trình lặp bất đồng bộ cung cấp một cách mạnh mẽ để xử lý các luồng dữ liệu bất đồng bộ, các thư viện Lập trình phản ứng như RxJS cung cấp một bộ công cụ toàn diện hơn để xây dựng các ứng dụng phản ứng phức tạp. RxJS cung cấp một bộ toán tử phong phú để biến đổi, lọc và kết hợp các luồng dữ liệu, cũng như các khả năng quản lý đồng thời và xử lý lỗi tinh vi.

Tuy nhiên, Trình lặp bất đồng bộ cung cấp một giải pháp thay thế đơn giản và nhẹ nhàng hơn cho các kịch bản mà bạn không cần đến toàn bộ sức mạnh của RxJS. Chúng cũng là một tính năng gốc của JavaScript, có nghĩa là bạn không cần thêm bất kỳ phụ thuộc bên ngoài nào vào dự án của mình.

Khi nào nên sử dụng Trình lặp bất đồng bộ so với RxJS

• Sử dụng Trình lặp bất đồng bộ khi:
  • Bạn cần một cách đơn giản và nhẹ nhàng để xử lý các luồng dữ liệu bất đồng bộ.
  • Bạn không cần toàn bộ sức mạnh của Lập trình phản ứng.
  • Bạn muốn tránh thêm các phụ thuộc bên ngoài vào dự án của mình.
  • Bạn cần làm việc với dữ liệu bất đồng bộ một cách tuần tự và có kiểm soát.
• Sử dụng RxJS khi:
  • Bạn cần xây dựng các ứng dụng phản ứng phức tạp với các phép biến đổi dữ liệu và xử lý lỗi tinh vi.
  • Bạn cần quản lý đồng thời và các hoạt động bất đồng bộ một cách mạnh mẽ và có khả năng mở rộng.
  • Bạn cần một bộ toán tử phong phú để thao tác với các luồng dữ liệu.
  • Bạn đã quen thuộc với các khái niệm Lập trình phản ứng.

Khả năng tương thích trình duyệt và Polyfills

Trình lặp bất đồng bộ và Trình tạo bất đồng bộ được hỗ trợ trong tất cả các trình duyệt hiện đại và các phiên bản Node.js. Tuy nhiên, nếu bạn cần hỗ trợ các trình duyệt hoặc môi trường cũ hơn, bạn có thể cần sử dụng một polyfill.

Có một số polyfill có sẵn cho Trình lặp bất đồng bộ và Trình tạo bất đồng bộ, bao gồm:

• core-js: Một thư viện polyfill toàn diện bao gồm hỗ trợ cho Trình lặp bất đồng bộ và Trình tạo bất đồng bộ.
• regenerator-runtime: Một polyfill cho Trình tạo bất đồng bộ dựa trên biến đổi Regenerator.

Để sử dụng một polyfill, bạn thường cần đưa nó vào dự án của mình và nhập nó trước khi sử dụng Trình lặp bất đồng bộ hoặc Trình tạo bất đồng bộ.

Kết luận

Trình lặp bất đồng bộ của JavaScript cung cấp một giải pháp mạnh mẽ và tinh tế để xử lý các luồng dữ liệu bất đồng bộ. Chúng cải thiện tính dễ đọc, đơn giản hóa việc xử lý lỗi, và cung cấp khả năng triển khai các cơ chế áp suất ngược và hủy bỏ. Dù bạn đang làm việc với luồng API, xử lý tệp, luồng dữ liệu thời gian thực, hay truy vấn cơ sở dữ liệu, Trình lặp bất đồng bộ có thể giúp bạn xây dựng các ứng dụng hiệu quả và có khả năng mở rộng hơn.

Bằng cách hiểu các khái niệm chính của Trình lặp bất đồng bộ và Trình tạo bất đồng bộ, và bằng cách tận dụng vòng lặp for await...of, bạn có thể khai phá sức mạnh của việc xử lý luồng bất đồng bộ trong các dự án JavaScript của mình.

Hãy cân nhắc khám phá các thư viện như it-tools (https://www.npmjs.com/package/it-tools) để có một bộ sưu tập các hàm tiện ích làm việc với các trình lặp bất đồng bộ.

Tìm hiểu thêm

• Tài liệu web MDN: for await...of
• Đề xuất TC39: Async Iteration