RxDart – 響應式編程神器

一、簡介

RxDart 是一個基於 Dart 語言的響應式編程庫。響應式編程是一種面向數據流和變化傳播的編程範式，它以數據流和變化傳播方式進行編程。在響應式編程模型中，通過訂閱來觀察數據流，並且可以對數據流進行過濾、變換和組合等操作。在Dart語言中，RxDart提供了一個友好和高效的API，幫助我們更輕鬆地使用響應式編程。

二、核心概念

RxDart庫提供了一些核心概念如下：

Observable：可觀察對象，它表示一個異步數據流序列，可以發射多個數據項，也可以在發射數據的同時終止。

//示例代碼
Stream stream = Stream.fromIterable([1,2,3,4,5]); 
Observable observable = Observable(stream);

Stream ：Dart中的異步事件處理機制，它表示一個異步的數據流，可以包含多個數據，也可以在多個數據發送後自動關閉流。

//示例代碼
//建立一個Stream對象
Stream stream = Stream.fromIterable([1,2,3,4,5]); 
//輸出流中的每個數據
await stream.forEach((element) { print(element); });

Subject：也是可觀察對象，除了可以像 Observable 一樣發射數據和終止外，還可以像 Stream 一樣充當數據源，是一個可觀察對象和一個流控制器的混合體。Subject有四種類型：PublishSubject、BehaviorSubject、ReplaySubject和ValueSubject 。

//示例代碼 
//創建一個PublishSubject
PublishSubject subject = PublishSubject();
subject.add('A'); //異步添加數據A
subject.listen((data){ //異步監聽subject的數據流，並打印
  print(data);
});
subject.add('B'); //異步添加數據B

Subscriber : 訂閱者，它是一個異步的事件消費者，它可以接收Observable或Subject發送的事件。

//示例代碼 
Observable.fromIterable([1,2,3,4]).subscribe(print);

三、常用操作符

RxDart提供了很多有用的操作符，有助於處理和轉換Observable數據流的各個方面。以下是常用的操作符：

map：將一個Observable中的數據源中的每一個數據映射到一個新的Observable上。

//示例代碼
Observable.range(1, 3).map((item)=>item*10).listen(print);
//輸出
//10
//20
//30

where ：依據指定的條件選擇數據源中的數據發送到新的Observable上。

//示例代碼
 Observable.range(1, 10).where((item) => item % 2 == 0).listen(print);
 //輸出
 //2
 //4
 //6
 //8
 //10

startWith ：在Observable數據源的前面插入一些指定的數據。

//示例代碼
Observable.just(3).startWith(1,2).listen(print);
//輸出
//1
//2
//3

buffer ：緩存指定數量的Observable數據到列表中。

//示例代碼
Observable.range(1, 10).buffer(3).listen(print);
//輸出
//[1,2,3]
//[4,5,6]
//[7,8,9]
//[10]

debounce：去掉Observable中連續出現的數據，只出現一次。

//示例代碼
Observable.timer(1, Duration(milliseconds: 500)).debounce(Duration(seconds: 1)).listen(print); //防抖
//輸出
//1

四、常見應用場景

RxDart能夠廣泛應用於各種場景。例如：

1、頁面間數據傳遞

一般來說，我們在不同的頁面中通過 Provider、InheritedWidget 等來共享數據。但是有的時候，我們並不需要在整個 App 中共享數據，僅僅只是在兩個頁面間傳遞數據。這時候，使用 RxDart 來傳遞數據顯然是一種更加優秀的選擇。

//示例代碼
class DataTransfer {
  final publishSubject = PublishSubject();
}

class PageA extends StatelessWidget {
  final _dataTransfer = DataTransfer();

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: Center(
        child: ElevatedButton(
          onPressed: () {
            _dataTransfer.publishSubject.add('Hello from A');
            Navigator.of(context)
                .push(MaterialPageRoute(builder: (context) => PageB(_dataTransfer)));
          },
          child: Text('Jump to Page B'),
        ),
      ),
    );
  }
}

class PageB extends StatelessWidget {
  final DataTransfer _dataTransfer;

  PageB(this._dataTransfer);

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: StreamBuilder(
        stream: _dataTransfer.publishSubject.stream,
        builder: (context, snapshot) => Center(
          child: Text(
            snapshot.data ?? '',
            style: TextStyle(fontSize: 30),
          ),
        ),
      ),
    );
  }
}

2、網絡請求合併

在實際項目中，有時需要對同類型的網絡請求進行合併，即發起一次請求，但是在返回數據時，要將多個請求的數據返回。這個時候，我們可以使用RxDart提供的合併操作符。

//示例代碼
Observable.combineLatest2(
    Observable.timer(1, const Duration(minutes: 1)),
    Observable.timer(2, const Duration(seconds: 2)),
    (one, two) => "結果是：($one,$two)"
).listen(print);  //輸出結果為：結果是：(1,2)

3、表單驗證和輸入過濾

表單驗證和輸入過濾是通過數據過濾和組合操作的一種具體體現，而使用RxDart可以讓表單驗證和輸入過濾更加輕鬆和高效。

//示例代碼
final userName = StreamController();
final password = StreamController();
final loginEnabled = StreamController.broadcast();
 
Observable.combineLatest2(userName.stream, password.stream, (name, pass) => name.length > 6 && pass.length > 6)
          .listen((enable) => loginEnabled.sink.add(enable));

五、小結

RxDart是Dart中非常強大的響應式編程庫，它提供了許多的功能和操作符以便我們更加高效地進行數據流處理。在實際項目中，RxDart廣泛應用於各種場景，例如頁面間數據傳輸、網絡請求合併、表單驗證和輸入過濾等，相對於其他傳統的編程模型，響應式編程能夠更加簡潔高效地表達代碼邏輯和業務邏輯，同時也非常適用於異步I/O場景，防止回調地獄的發生，大大提高了編程的便捷性和可讀性。