Observable은 단어 뜻처럼 지속적으로 관찰 가능한 객체라는 의미이다.
변경될 때마다 변경된 값을 비동기적으로 제공하겠다는 것을 구현해 놓은 객체라고 생각하면 된다.
또한 자바스크립트에서 1개 이상의 item을 처리할 때 async와 같은 방법을 사용한다.
여기서 promise 방식을 사용해 구현하면 단 하나의 data를 받고 종료되어 버리는 패턴을 가지고 있어,
데이터를 시간의 흐름에 따라 순차적으로 받아야 하는 상황이 생긴다면 promise를 사용해 처리할 수 없다.
그래서 이때 사용하는 것이 Observable 객체이다.
여기서 promise와의 차이점은 취소가 가능하다는 것인데
Observable 순차적으로 데이터를 받아 처리하기 때문에 취소할 수가 있다.
이는 다수의 비동기적인 값들을 방출할 때 사용된다.
Item을 여러개 방출 할 수 있다.
Item의 발행 완료 이벤트를 방출할 수 있다.
Item의 발행 도중 에러가 발생했다면 여러 이벤트를 방출 할 수 있다.
데이터가 여러번 발행 될 수 있는 곳에서 주로 사용한다.
데이터가 1000번 미만으로 발행되는 경우에 사용하는 것이 좋다.
Out of Memory Error가 발생되지 않을 가능성이 높은 곳에서 사용하는 것이 좋다.
터치 이벤트, 키보드 입력과 같은 GUI 이벤트를 받을 때 주로 사용한다.
rx/js 라이브러리를 사용하면 다음과 같이 Observable을 사용할 수 있다.
const observable = new Observable(observer => {
setTimeout(() => {
observer.next('Hello from a Observable!');
}, 2000);
});
observer.next()
은 아래처럼 사용 가능하다.
next는 최신 값을 전송하는 이벤트이고,
error는 Obervable이 값을 배출하다 에러가 발생하면 error을 배출하고 종료하는 이벤트이다.
complete는 성공적으로 이벤트 시퀀스를 종료시키는 이벤트이다.
마지막으로 observable.subscribe()
의 사용으로
비동기적인 시점에 값이 변경될 때마다 지속적으로 호출할 수있다.