Thẻ học RxJS

Nhà tài trợ chuyên mục

RxJS (Reactive Extensions for JavaScript) là một thư viện mạnh mẽ cho lập trình phản ứng, ban đầu được tạo ra bởi Microsoft và hiện được phát triển bởi cộng đồng mã nguồn mở. Đây là một công cụ quan trọng trong hệ sinh thái JavaScript, được thiết kế để xử lý các hoạt động bất đồng bộ và luồng dữ liệu. RxJS nổi bật với một tập hợp phong phú các toán tử và tính linh hoạt, cho phép quản lý hiệu quả cả luồng dữ liệu đơn giản và phức tạp trong các ứng dụng. Thư viện này cung cấp các khái niệm nâng cao như Observable, Operators và Schedulers, cung cấp cho nhà phát triển các công cụ để tạo ra các ứng dụng đáp ứng, hiệu quả và dễ bảo trì. RxJS cũng hỗ trợ tích hợp với các framework JavaScript khác nhau và thường xuyên được cập nhật với các tính năng và cải tiến mới, duy trì tính nhất quán với các khái niệm phản ứng và cho phép phát triển các ứng dụng có thể mở rộng, dựa trên sự kiện trong môi trường trình duyệt và Node.js.

Ứng dụng thẻ học của chúng tôi bao gồm các câu hỏi phỏng vấn RxJS được chọn lọc kỹ lưỡng với câu trả lời chi tiết sẽ chuẩn bị hiệu quả cho bạn cho bất kỳ cuộc phỏng vấn nào yêu cầu kiến thức về RxJS. IT Flashcards không chỉ là một công cụ cho những người tìm việc - đó là một cách tuyệt vời để củng cố và kiểm tra kiến thức của bạn, bất kể kế hoạch nghề nghiệp hiện tại của bạn là gì. Sử dụng ứng dụng thường xuyên sẽ giúp bạn cập nhật với những xu hướng RxJS mới nhất và giữ kỹ năng của bạn ở mức cao.

Thẻ học RxJS mẫu từ ứng dụng của chúng tôi

Tải xuống ứng dụng của chúng tôi từ App Store hoặc Google Play để nhận thêm flashcard miễn phí hoặc đăng ký để truy cập vào tất cả flashcard.

RxJS là gì?

Reactive Extensions cho JavaScript, còn được gọi là RxJS, là một thư viện lập trình được sử dụng cho lập trình phản ứng trong JavaScript. RxJS thực thi mẫu thiết kế Observer và cho phép thực hiện các hoạt động bất đồng bộ phức tạp và xử lý callback bằng cách cung cấp luồng sự kiện.

RxJS cung cấp các cấu trúc dữ liệu được gọi là Observables, trong thực tế là các dòng thông tin có thể được "quán sát". Một Observer có thể đăng ký những dòng này và phản ứng với thông tin chảy từ chúng.

Mục tiêu chính của thư viện RxJS là hỗ trợ quản lý các hoạt động và sự kiện bất đồng bộ trong các ứng dụng. Nó cho phép quản lý minh bạch dòng dữ liệu, do đó giảm nhẹ công việc với mã thường gây nhầm lẫn khi sử dụng callback hoặc lời hứa thông thường.

RxJS thường được sử dụng kết hợp với những thư viện hoặc khung front-end khác, như Angular hoặc React. Sự phổ biến của nó cũng do hỗ trợ nhiều toán tử cho phép lọc, nhóm, chỉnh sửa, và nhiều hoạt động khác trên luồng dữ liệu.

Sự khác biệt giữa Observable và Promise là gì?

Observable và Promise là hai cách khác nhau để biểu diễn các hoạt động không đồng bộ trong JavaScript.

Promise là một đối tượng trả về một giá trị duy nhất trong tương lai. Tại thời điểm tạo đối tượng Promise, hoạt động đã bắt đầu chạy và không thể dừng lại. Promise có thể ở trong một trong ba trạng thái: đang chờ, đã hoàn thành, hoặc bị từ chối.

let promise = new Promise((resolve, reject) => {
  setTimeout(() => {
    resolve('Promise đã hoàn thành');
  }, 2000);
});

promise.then(result => console.log(result)); 
// Sau 2 giây, console sẽ hiển thị 'Promise đã hoàn thành'

Một Observable từ RxJS, ngược lại, có thể trả về nhiều giá trị, hoặc thậm chí là một số lượng vô hạn, bất cứ lúc nào. Việc đăng ký một Observable bắt đầu hoạt động, có thể dừng bằng cách sử dụng phương thức unsubscribe().

let observable = new Observable(observer => {
  setTimeout(() => {
    observer.next('Callback đầu tiên');
    setTimeout(() => {
      observer.next('Callback thứ hai');
      observer.complete();
    }, 2000);
  }, 2000);
});

let subscription = observable.subscribe(result => console.log(result)); 
// Sau 2 giây, console sẽ hiển thị 'Callback đầu tiên'
// Sau thêm 2 giây nữa, console sẽ hiển thị 'Callback thứ hai'
// Bất kỳ lúc nào bạn có thể dừng quan sát bằng 'subscription.unsubscribe();'

Kết luận, một trong những khác biệt chính giữa Observable và Promise là Observable là 'lazy', có nghĩa là đối tượng Observable sẽ không thực hiện hoạt động cho đến khi nó được đăng ký, trong khi Promise bắt đầu hoạt động ngay sau khi nó được tạo. Một sự khác biệt quan trọng khác là khả năng hủy quan sát của một Observable, điều này không thể với Promise.

Kể tên một số toán tử cơ bản trong RxJS.

RxJS cung cấp nhiều toán tử hữu ích giúp chỉnh sửa luồng dữ liệu, phản hồi thay đổi, v.v. Dưới đây là một số trong số đó:

1. map() - biến đổi dữ liệu đến từ luồng được quan sát.

2. filter() - cho phép lọc dữ liệu từ đối tượng có thể quan sát theo tiêu chí cụ thể.

3. tap() - được sử dụng để gọi tác dụng phụ.

4. take() và first() - lấy một số lượng giá trị cụ thể từ luồng đã quan sát.

5. debounceTime() và throttleTime() - cho phép hạn chế số lượng giá trị phát ra trong một khoảng thời gian nhất định, điều này hữu ích, ví dụ, khi phản hồi chuyển động chuột hoặc nhập vào trường văn bản.

6. catchError() - cho phép xử lý các ngoại lệ được ném bởi nguồn đã quan sát.

7. switchMap() và mergeMap() - cho phép ánh xạ mỗi giá trị phát ra đến một đối tượng có thể quan sát, sau đó có thể được hợp nhất với các luồng.

8. combineLatest() - cho phép kết hợp các luồng từ các nguồn khác nhau.

9. of() và from() - các toán tử này cho phép tạo đối tượng có thể quan sát từ các loại dữ liệu khác nhau, ví dụ: mảng, Promise, các đối tượng có thể lặp lại, v.v.

Đây chỉ là các toán tử cơ bản, nhưng RxJS cung cấp nhiều khả năng hơn. Mỗi toán tử đều có các đặc điểm riêng và hữu ích trong các tình huống khác nhau.

Những loại Subject nào có trong RxJS?

Trong thư viện RxJs, chúng tôi có bốn loại Subject để sử dụng:

1. Chủ đề Plain - Đây là loại cơ bản của Subject. Nó phát ra giá trị cho các quan sát viên chỉ vào thời điểm phát xạ và sau đó. Giá trị phát xạ trước đó không có sẵn cho các người đăng ký mới.

let subject = new Subject();
subject.next(1); // Sẽ không được nhận bởi bất kỳ quan sát viên nào
subject.subscribe((value) => console.log(value)); // Đăng ký cho phát xạ trong tương lai
subject.next(2); // Sẽ in '2'

2. Chủ đề hành vi - Lưu trữ giá trị phát xạ cuối cùng và cung cấp nó cho các người đăng ký mới ngay lập tức khi đăng ký. Nó phải được khởi tạo với giá trị ban đầu.

let subject = new BehaviorSubject(1); // Được khởi tạo với giá trị '1'
subject.subscribe((value) => console.log(value)); // In '1' ngay lập tức sau khi đăng ký
subject.next(2); // Sẽ in '2'

3. Chủ đề Replay - Bạn có thể chỉ định bao nhiêu giá trị cuối cùng mà nó nên lưu trữ và cung cấp cho các quan sát viên. Nó lưu trữ thông tin thời gian, vì vậy chúng tôi có thể truy cập dữ liệu cụ thể, chẳng hạn như từ một phút trước.

let subject = new ReplaySubject(2); // Sẽ lưu trữ 2 giá trị cuối cùng
subject.next(1);
subject.next(2);
subject.next(3);
subject.subscribe((value) => console.log(value)); // Sẽ in '2', '3'

4. Chủ đề Async - Phát ra giá trị cuối cùng chỉ khi Subject đã hoàn thành hoạt động.

let subject = new AsyncSubject(); // Chỉ phát ra giá trị cuối cùng và chỉ khi hoàn thành
subject.next(1);
subject.next(2);
subject.subscribe((value) => console.log(value)); // Chưa in bất kỳ thứ gì
subject.next(3);
subject.complete(); // Vì hoạt động đã hoàn thành, nó sẽ phát ra giá trị cuối cùng. Sẽ in '3'