map, mergeMap

 of(1,2,3).pipe( 
      map(val=>{
        return ajax.getJSON(`https://jsonplaceholder.typicode.com/posts/${val}`);
      })
    ).subscribe(data=>{
      data.subscribe(console.log)
    })

원시값형태의 옵저버블객체에 map오퍼레이터를 사용하는데 원시값을 반환하지 않고 옵저버블객체를 반환하면 Observable<Observable< number>>의 이중구조가 된다.

이러한 옵저버블객체도 사용가능하지만 구독함수를 2번연결해야 원하는 데이터를 얻을 수 있다.

    of(1,2,3).pipe( 
      map(val=>{
        return ajax.getJSON(`https://jsonplaceholder.typicode.com/posts/${val}`);
      }),
      mergeMap(obs=>obs)
    ).subscribe(console.log)

map오퍼레이터를 사용한후 mergeMap을 사용하면 mergeMap은 Observable< number>의 옵저버블객체를 반환한다.

    of(1,2,3).pipe( 
      mergeMap(val=>{
        return ajax.getJSON(`https://jsonplaceholder.typicode.com/posts/${val}`);
      })
    ).subscribe(console.log)

mergeMap을 map대신 사용하면 된다.

---

    of(1,2,3,4,5).pipe(
      mergeMap(val=>{
        return ajax.getJSON(`https://jsonplaceholder.typicode.com/posts/${val}`)
      }),
    ).subscribe(console.log)

ajax로 받아온 데이터는 순서대로 방출됨을 보장하지 않는다.

    of(1,2,3,4,5).pipe(
      mergeMap(val=>{
        console.log(val);
        return ajax.getJSON(`https://jsonplaceholder.typicode.com/posts/${val}`)
      },1), // 1 mergeMap 옵션을 사용하면 순서대로 데이터를 가져온다
    ).subscribe(console.log)