[前提] of、fromはobservableを作るもの
ofとfromは、Observableにするメソッドなので、前提としてObservableの概念を学ばなければいけません。
https://tech.recruit-mp.co.jp/front-end/rxjs-intro/
##subscribeの説明
subscribeはobservableに付随するメソッドです。
observableを川の流れと例えると、subscibeは下流に来た値を流す処理です。
以下がsubscribeメソッドの中身です。
subscribe(
(x) => console.log(x), // onNext
(error: Error) => console.error(error), // onError
() => console.log('Completed!!') // onComplete
)
- 新しい値が取得できたら、onNextメソッド、
- エラーが出たら、onErrorメソッド、
- 全ての値が流れ切った時に、OnCompleteメソッドが発火します、
#[of] 引数の値を,observableにする
引数の値をObservableのデータにします。
// numberをobservableにして、引数である、1と２をストリームのデータにします。
const number = of(1,2);
// subscribeで、1と2を取り出します。
number.subscribe(val => console.log(val))
=> 1,2
#[from] 引数の値を分解した要素を、observableの値にする
fromは、引数の値を分解して、observebleの値にします。
配列の場合
// 配列を、引数に入れる。fromで、要素が分解されるので、1と2をストリームのデータにします。
const array = from([1,2])
// subscribeで、1と2を取り出します。
array.subscribe(val => console.log(val))
=> 1,2
配列型オブジェクトの場合
配列とほぼ同じです。
const numbers: Number[]
numbers = [1,2]
const array = from(numbers)
array.subscribe(val => console.log(val))
=> 1,2
Stringの時
// stringを引数に入れる。stringの文字列が分解されて,"s","t","r","i","n","g"を
const string = from("string");
// subscribeで、"s","t","r","i","n","g"を取り出す。
string.subscribe(val => console.log(val))
=> "s","t","r","i","n","g"
Promiseの時
function numberOne() {
return 1
};
function numberTwo(){
return 2
};
const promise = new Promise((numberOne, numberTwo) => {
const one = numberOne();
const two = numberTwo();
setTimeout(() => {
return [one, two]
});
}
const promise = promise()
const result = from(promise);
result.subscribe(val => console.log(val));
=> 1,2
まとめ
| of | from | |
|---|---|---|
| 役割 | Observableにする | Observableにする |
| 引数の数 | 複数 | 一つ |
| 引数にする値 | 値 | 配列、配列型オブジェクト、Promise,Observable,string |
##引用