[Angular] Observer-and-Observable

Self Study

Posted by Mihyun on April 8, 2020

옵저버와 옵저버블

  • 옵저버블: 연속된 데이터 스트림을 생성하는 객체
    • 소켓이나 배열, 화면에서 발생한 이벤트 등과 같은 데이터 소스를 한번에 하나씩 연속으로 보내는(스트리밍) 객체
    • 처리 가능 케이스
        1. 다음 엘리먼트를 전달
        1. 에러를 전달
        1. 스트리밍 종료되었다는 신호 전달
    • 콜드 옵저버블: 구독자가 있는 경우에만 스트리밍 데이터를 만들기 시작
    • 핫 옵저버블: 데이터를 받는 구독자가 없더라도 데이터를 스트리밍
  • 옵저버: 이 스트림을 구독해서 사용하는 객체
    • 세 가지 콜백 함수
        1. 다음 엘리먼트 받았을 때 처리하는 함수
        1. 에러를 받았을 때 처리하는 함수
        1. 데이터 스트림이 끝났을 때 실행하는 함수
  • 옵저버블 데이터 스트림을 사용하면 비동기 프로그래밍을 간단하게 구현할 수 있다. 스트림은 원하는 시점에 구독하거나 해지할 수 있고, 데이터를 요청하기 위해 서버로 보낸 요청을 취소할 수도 있다
  • subscribe(), unsubscribe(): 옵저버블 객체로부터 스트림을 구독/구독취소
  • 예시: 최초 발행자인 옵저버블은 사각형 데이터 스트림을 만든다 -> map() 함수는 이 사각형을 삼각형으로 변환한다 -> filter() 함수는 삼각형으로 표현된 데이터 중에 원하는 것만 골라서 구독자에게 전달

  • 책 출처: Angular Development with TypeScript