?

?? ?? , ?
• ? ?? ???? ?? ???? ????? ???? ? ??? ? ???, ? ???? ??? ?? ? ??? ????? ?? ??????.
• ??? ?? ?? ?? ??? ??? ????? ????, ?? ?? ?? ? ?? ???? RXJ? ???? ?????. map() filter() ??? ????? ??? ?????? ?? ??? ???? ??? ???? ?? ????? ??? ??? ????? ???????. reduce() ??? - ?? RXJS ?? ??? ?? ??? ?? - ?? ??? ??? : ???? ??? ??? ????? ??? ? ?????. OnClick ?????? ?? ??? ??? ??? ??? ??? ??? ????. take() ?? ???, ?? ??? ??? ??? ??? ?? ??? ??? ??? ????.
? ??? ??? ?? ???, DOM ???, API ?? ? ??? ?? ?? ? ?? ???? ?? ?? ?? ??? ?? ? ????. ????? ??? ?????? ?? ??? ??? ????? ?? ???? ???? ? ?????.
• ?? flatMap()?? ?? ??? ?? ??? ???? ?? ? ???? ????? ??? ?????. ?? ???? ???? ?? ??? ????. switch() ??? ?? ??? ??? ???? ?????. ?? ??? ???? ???? ???? ?? ? ? ???? [1, 2, 3]. ??? ??? ??? 4? ?? ??? ?? ? ? ????.
???? ?? ??? ??? ?? ???? ???? ??? ??? ?? ??? ?? ? ?? ????? ???? ?????.
• rxjs ???? ? ? ?? ??????. rxjs? ???? ???? ??? ? ??? ??? ???? ??? ?? ??? ??.

  ???? ??? ?? ?? ? ??? ? ?? ? ?????? ??? ???? ?????.

  ??? ??? "?? ??"??? ? ???????? ?? ????. ??? ???? ?? ? ??? :

  ??? ?? ??? ??? ? ??? ???? ??? ?? ??? ????? ???? ??? ???? ??? ? ???? ??? ?? ??? ??? ? ?? ???? ?? 3 ?? ??? ??? ?? ????

  ??? ??? ??? ?? ??? ??? ???? ?? ?? ?????.

  const task_stream =
    // 創(chuàng)建所有數(shù)據(jù)庫中任務(wù)的流
    getTasks().
      // 只獲取此用戶的任務(wù)
      filter((task) => task.user_id == user_id).
      // 獲取未完成的任務(wù)
      filter((task) => !task.completed).
      // 只獲取任務(wù)名稱
      map((task) => task.name)
  
  /* 任務(wù)如下所示：
     task = {
      user_id   : number,
      completed : boolean,
      name      : string
     }
   */

  ?? ?? :

  parameter_stream? ???? ?? ? ?? ?? ??? ??? ??? ?? ??? ??? ????? ????? <)> debounce () ?? ??? ???? ??? ????? GetTasks () ??? ??? ??? ????? ConstruntilChanged ()? ??? ??? ??? ??? ??? ???? update ()? ???? ?? ??? ???? ?? UI? ???? ? ??? ????.

  ?? ?? ???? ?? ??? ??, ? ?? ? "???"??? ?????? ??? ?? ?????.
  • ?? rxjs? ??? ?????? ??? ????
  ?? ????; <;> ?? ??? ???; ???? ????? ??? ?? ??.
  rxjs? ?? 10 ? ?? ?? ??? ???? ???? ?? ??? ? ??? ??????.
  • <<> ??? ?? ??
  ??? ???? ?? ?? (???? ?? ??? ?? ???? ???)?? ??? ?????.
  • <<<> map () <))> ?? () <<> ?? () < / /> take () / take while ()
  <(> take ()? take ()? ????, ??? JavaScript? ?? ?? ??? ?????.
  ??? ?? ??? ???? ??? ??? ?????. .com ?? .org ? ???? ???? ??????? ?? ???? ?? ? ??? ??? ?? ??? ?????.

  const task_stream =
    parameter_stream.
      debounce(1000).
      map((parameter) => {
        getTasks().
          retry(3).
          filter((task) => task.user_id === user_id).
          filter((task) => task.completed === parameter).
          map((task)    => task.name)
      }).
      flatMap(Rx.Observable.from).
      distinctUntilChanged().
      update()

  JSONPLASEHOLDER? ???? ?? ??? ? ????. ??? ??? ??? ??? ???? JSON ?????.

  < > 1. ???? ???? ?? map ()? ?????? Observable Objects?? map ()? ???? ?? ???? ???? ?? ?????. It : <..>

  ??? ?? ??? ?????? ???? ??? ? ???? ?????? ?? ??? ? ??? ???? ?? ? ??? ???? ? ??? ?????.
  • ?? ??? ???? map ()? ??? ?? ??? ???? ??? ????.
  ??? ??? ?? ??? ?? ??? ??? ????? ?? ??? ??? ?? ??? ????? ?? ??? ????? ?? ? ? ?????.
  ?? ; rx.observable.from; <.> flatmap.
  1. Promise? ?? ??? ??
  ??? ?? ?? ??? ?? ?? ??? ?? ??? ??? ?? ??? ?? ??? ?? ?????.
  Promise? ?? ??? ??? ???? ?????. ?? ??? ???? ?? ? ? ????.

  ??? rx.observable.fromise ()? ???? ?? ? ?? : ? ???? ?? ??? ??? ???? ?? ?????.

  ??? ?? ??; ?? ?? ? ??.
  ??? ????? ??? ???? ??? ?? ? ??? ????. ??? ??? ?? ? ? (??? ??) ?? ??? ?? ??? ??? ?? ??? ???? ?? ??? ??? ??? ?? ?????.
  <> 6. flatMap () ? ?????? ? ????? ???????,? ??? flatmap ()? ?????. ???? ??? ?? ???? ?? ????? ???? ???? ? ?????.
  1. flatmap ()? ??? ?? ??? ????
  ?? ?? ??? ?? ??? ??? ???? ?? ??? ???? flatmap ()? ?????? ??? ?? ??? ??? ???? ?? ??? ??????.
  <,>? ???? rx.observable.from ()? ???? ?? ??? ???? ?????.
  ??? ?? ??? ??? ????

  rxjs? ?? flatmap () : selectmany ()? ?? ??? ?????.

  ?? ??? ?? ?????, ??? ?? ???? ?? ?? ???? ????. ???? ???? ???? ?? ??? ??? ??? ?? ??? ? ?? ?????.

  <> 7. concat () ? merge ()? ???? ??? ? ????? ?? ? ??? ???? ???? ?? ???? ? ?? ?????.

  ??? ? ?? ???? ?? ?? ? ??? ? ???? ?? ? ?? ? ?? ???? ?? ?????? ? ???? ????.

  ??? ?? ???? ?? ???? ?? ????? ? ???? ???? Facebook ????? ??? ? ??? ???? ?? ?? ??????. Concat ()? ? ?????? ?????? ????? ?? ???? ???? ?? ? ??? ??? ???? ?????. Merge ()? ?? ??? ??? ??? ? ?? ??? ?????? ?? ????.

  concat () ???? ?? Source1? ?? ?? ???? Source1? ??? ?? ? ??Source2? ?? ???? ?????.
  1. <))> merge () ???? ?? ? ??? ?? source1 ? source2? ?? ?????. ? ?? ???? ?? ???? ?? ? ?? ???? ????? ???? ????.
  < > 8. Switch () <
  2. ? ?????? ?????, ??? ?? ??? ??? ???? ?? ??? ??? ?? ??? ??? ?? ???? ??? ??? ????.
  Facebook Messenger? ??? ?? ????? Switch ()? ?????.
  ? ??? ?? RXJS? ???? ?????.

  ??? ?????? switch ()? ? ?? ?? ?? ??? ?????. ???? ????? ?? ??? ??? ?? ????? ????? ?? ?? ?? ????? ??? ?? ? ? ????. ??? Switch ()? ???? ?? ?? ??? ???? ????.

  ?? ???, ??? ???? ???? ????? ????? ???? ? ??? ??? ?? ??? ? ???????. ?? ?? ???? ??? Debounce () ????? ?? ???? ?? ? ?? ?? ? ??? ??? ()? ??? ? ????. API? ????? ????? ?????.

  > 9 ???? ?? ID? ????? ???? ?? ? ?????? ?????????

  <,> ??? ??, ?? ?? ?? ??? ??? ???? ????? ??? ID? ??? ? ????.

  ? ?? ??? ????. ?????? ?? :

  <;> ??? ?????? <.> ? ?? ??? ??????.

  combinelatest () ? ???? ?? ?? ??? ?????? ? ?? ??, ??? ??? ???? ???? ??? ???? ???? ???????.

  ???? ?? ?? ??? ??; ?? ???? ??? ID.
  ??? combinelatest ()? ???? :
  ???? ?? ?? ? ??? CombinElatest ()? ?? ? ?? ?? ?? ?? ???? ?? ?? ? ??? ??? ?? ??? ?? ??? ?????.
  ??? ???? ?????? ? ????
  1. ? ???? ?? ???? ????? ZIP? ??????. ??? ???? ??? ID ? ?? ??? ??? ???? ? ??? ????? CombinElatest ()? Zip ()? ?????.
  ??, ??? ???? ????? ? ????.
  2. compinelatest ()? ?? zip ()? ???? ? ?? ??? ??? ?? ? ?? ??? ??? ? ???? ?? ? ??? ?????.
  < > 10. TakeUntil
  ?????, takeUntil ()? ???? ? ?? ???? ?? ???? ??? ??? ? ?? ?????? ? ????.
  ??? ???? ??????? ??? ?? ? ??? ?? ? ?????.
  ?? ??? ?? ??? ???? ????? ?? ??? ??? ?? ????.
  rxjs? ??? ???? ? ??? ??? ?? ??? ? ?? ??? ?????.
  1. rxjs lite? ???? ??? ???? ??? ?? ???????. ??? ??? ?? ??, ?? ?? ????? ?? ????.
  RXJS ?? (FAQ)? ?? FAQ
  RXJ? ???? ?? ????? ?? ???? ??????

  rxjs? ??? ?? ?? ?? ??? ??? ????? ?? ?? ??? ??? ???? ?? ? ????? ????????. ???? ??? ????? ???? ?? JavaScript? ???? ?? ?????. ?? ???? ???? ???? ?????. RXJS? ???? ????? ???? ??? ???? ???? ?? ? ?? ? ??? ?? ??? JavaScript??? ???? ???? ???? ?????.

  rxjs?? ?? ??? ??? ??? ??? ??????

  rxjs??? new Observable () ???? ???? ?? ??? ??? ?? ? ????. ? ???? ??? ?????? ???? ??? ???, ???? ?? ??? ??? ?? ? ? ?????. ?? ?? ??? ????.

  RXJS? ?? ???? ???? ??? ??????

  rxjs?? ?? ??? ??? ??? ??? ???? ??? ???? ???? ??? ??? ??? ???? ???? ????. ?? ??? ? ???? map (), filter (), reted (), merge () ? concat ()? ?????. ??? ? ???? ??? ??, ?? ?? ?????? ?? ???? ???? ? ??? ???? ??? ???? ?????.

  const task_stream =
    // 創(chuàng)建所有數(shù)據(jù)庫中任務(wù)的流
    getTasks().
      // 只獲取此用戶的任務(wù)
      filter((task) => task.user_id == user_id).
      // 獲取未完成的任務(wù)
      filter((task) => !task.completed).
      // 只獲取任務(wù)名稱
      map((task) => task.name)
  
  /* 任務(wù)如下所示：
     task = {
      user_id   : number,
      completed : boolean,
      name      : string
     }
   */

  rxjs? ??? ???? ??? ??????

  rxjs? catcherror (), retry () ? retryed way ()? ?? ??? ???? ?? ???? ?????. CatchError () ???? ?? ??? ????? ??? ?? ??? ?? ??? ??? ????? ??? ??? ? ?????. Retry () ???? ??? ??? ?? ?? ??? ??? ?? ???? ? ??? ? ????. () ???? ????? ? ??? ????? ? ????? ? ? ?? ? ? ????.

  rxjs?? ?? ??? ??? ??? ???? ??? ??????

  ?? ??? ?? ???? unsubscribe () ?????? ???????. ? ??? ???? ?? ??? ??? ??? ???? ???? ??? ??? ? ????. ?? ??? ????.

  ?? ?? ?? ??? ??? ?? ?? ??? ??? ???? ??????

  rxjs??? ?? ??? ??? ???? ??? ? ????. ?? ?? ???? ?? ? ? ???? ????? ??? ?? ???? ???? ??? ?? ?????. ?? ??, ??? ?? ??? ??? ?????? ??? ?? ??? ??? ??? ????.

  RXJ?? ?? ?? ??? ??? ???? ??? ??????

  rxjs? merge (), concat (), combinelatest () ? zip ()? ?? ?? ?? ??? ??? ???? ?? ???? ?????. ??? ? ???? ?? ??? ?? ??? ???? ??? ???? ?????.

  RXJS ??? ??? ??????

  RXJS? ??? ?? ????? ?? ?? ???? ???? ?? ??? ?? ??? ?????. ???? ?? ??? ??? ?? ??? ?? ????? ?????? ?????.

  angular? ?? rxjs? ???? ??? ??????

  Angular? RXJ? ???? ????? ??? ??? ?????. ?? ???? RXJ? ???? ??? ??? ???? ?? ??, ????, ????, ?? ?? ?? ??? ??? ? ????.

  rxjs? ???? ?? ??? ??????

  const task_stream =
    parameter_stream.
      debounce(1000).
      map((parameter) => {
        getTasks().
          retry(3).
          filter((task) => task.user_id === user_id).
          filter((task) => task.completed === parameter).
          map((task)    => task.name)
      }).
      flatMap(Rx.Observable.from).
      distinctUntilChanged().
      update()

  rxjs? ??? ???? ??? ??? ?????? ??? ? ????. ?? ???? ?? ???? ??? ?? ??, HTTP ??, WebSocket ?? ? ????? ??? ?????.

  ? ??? 10 ??? ?? ??? ? RXJS ??? ?? ?????. ??? ??? PHP ??? ????? ?? ?? ??? ?????!