Angular를 처음 접했을 때 Observable을 보고 너무 어렵게 느껴졌다.
물론 지금도 어렵지만... stackoverflow를 참고하여 작성한다.
공통점은?
둘다 async 비동기 함수 호출을 할 때 사용한다.
- promise 비동기 함수 호출
const promise = new Promise(resolve => {
setTimeout(() => {
resolve("Hello from a Promise!");
}, 2000);
});
promise.then(value => console.log(value));
- Observable 비동기 함수 호출
const observable = new Observable(observer => {
setTimeout(() => {
observer.next('Hello from a Observable!');
}, 2000);
});
observable.subscribe(value => console.log(value));
차이점은?
Promise는 하나의 값에 대해 resolve하거나 reject한다. 그리고 한번에 하나의 값에 대해서만 async 비동기 처리를 한다.
한번 완료된 async한 값을 resolve하고나면 더 이상 사용이 불가능하고 취소할 수가 없다.
Observable은 그러한 점을 개선했는데 다수의 asynchronous 값들을 emit할 수 있다. 즉 다수의 값, 이벤트 스트림을 다루기 위해 사용된다.
많은 task나 value의 배열을 처리할 때, 매시간마다 automatically 들어오는 값들을 처리하고 싶을 때 사용한다. 언제든지 값을 push할 수 있고 subscribers는 최신값들을 자동적으로 받을 수 있다.
Observables는 인풋 값이 바뀌거나 특정시간마다 반복될 때, 모든 자식 컴포넌트에게 값을 전달하고 싶을 때, 웹 소켓이 notifications을 push하고 싶을 때 사용한다. unsubscribe 함수를 사용하여 구독을 언제든지 취소할 수 있다.
진짜 중요한 부분은 rx/js 오퍼레이터를 제공한다는 것이다. map, filter, switchMap, combineLatest 오퍼레이터들을 pipe로 사용할 수 있고 subscribe하기전에 값을 transform할수도 있다.