프로그래밍124 [RxJS / angular] 18. Subject와 BehaviorSubject 이번 포스트에서는 subject와 observable의 차이를 알아보며 멀티캐스트와 유니캐스트의 정의를 살펴보겠습니다. 마지막에는 subject의 단점을 보안할 수 있는 BehaviorSubject에 대해 알아봅니다. Subject 란 Subject는 옵저버블이자 옵저버인 특별한 유형의 옵저버블입니다. subject는 아래 코드에서 처럼 new 키워드를 사용해서 생성할 수 있습니다. 생성할 때 제네릭으로 subject가 방출하는 항목의 타입 지정을 위해 타입 인수를 지정합니다. subject는 옵저버 인터페이스를 구현하기 때문에 next 메서드를 호출하여 항목을 방출할 수 있습니다. 그리고 여전히 옵저버블이기 때문에 알림을 수신하고자 하려는 모든 코드에서 subscribe 메서드를 호출할 수 있습니다. .. 2022. 7. 30. [RxJS / angular] 17. 데이터 스트림과 액션 스트림, Subject를 사용하는 이유 데이터 스트림과 액션 스트림이 무엇인지 알아보겠습니다. 그리고 액션 스트림에서 사용되는 Subject의 필요성에 대해 생각해 보도록 하겠습니다. 데이터 스트림(data stream)과 액션 스트림(action stream) http get을 호출하면 옵저버블은 response라는 하나의 항목을 방출합니다. 예를 들어 response가 배열 데이터 [{a},{b}]를 방출하고 우리는 방출된 데이터를 이용해 화면에 적절히 표시하게 됩니다. 이러한 흐름을 데이터 스트림으로 생각할 수 있습니다. 그리고 방출이 끝나면 옵저버블이 complete이 되므로 더 이상 데이터를 방출하지 않는 죽은 스트림이 됩니다. 액션은 유저에 의해 발생되는 이벤트 입니다. 예를 들어 선택 박스를 클릭해서 선택을 하는 행위를 액션이라고.. 2022. 7. 28. [RxJS / angular] 16. combineLatest 옵저버블 결합하기 데이터 스트림(혹은 옵저버블)을 결합하는 기술에 대한 포스트를 이어가고 있습니다. 지난 포스트까지 combineLatest와 forkJoin 생성 함수 그리고 withLatestFrom 연산자를 알아보았습니다. 이론을 익혔으니 combineLatest를 이용하는 실습을 하겠습니다. 사용자 친화적인 표시를 위해 두 데이터 스트림을 결합하여 숫자 ID를 문자열로 매핑하여 표시하는 과정을 소개하겠습니다. 실습 목표 아래와 같이 상품 목록을 조회하는 화면이 있습니다. 현재 카테고리 정보는 카테고리 ID, 즉 숫자로 표시하고 있습니다. 이러한 숫자 코드는 유저 그 뜻을 알기 어렵습니다. 뜻을 쉽게 파악할 수 있도록 ID에 해당하는 카테고리 이름으로 변경하고 싶습니다. 한편 데이터는 상품정보(카테고리 ID가 포함).. 2022. 7. 25. [RxJS / angular] 15. forkJoin과 withLatestFrom 데이터 스트림을 결합하는 방법에 대해 알아보고 있습니다. 지난 포스트에서는 combineLatest를 다뤘습니다. 이번 포스트에서는 http 통신에서 자주 사용되는 forkJoin 생성자에 대해 알아보고, 하나의 옵저버블의 변경에만 반응하는 withLatestFrom 파이프 연산자에 대해 알아보도록 하겠습니다. forkJoin 이란? forkJoin은 각 입력 옵저버블의 마지막 값을 사용해서 출력 옵저버블을 생성합니다. forkJoin의 핵심은 마지막 값이라는 점입니다. 위 예는 3개의 옵저버블에서 하나의 옵저버블을 생성하고 있습니다. forkJoin으로 생성한 옵저버블은 단 한번의 값을 방출합니다. 값을 방출할때는 입력 옵저버블이 모두 완료될때 입니다. 이때 방출된 값은 각 옵저버블의 마지막 값이 배열.. 2022. 7. 21. 이전 1 2 3 4 5 6 7 8 ··· 31 다음
