본문 바로가기

RxJS(Reactive X)11

[Chapter#2] RxJS 연산자들 -ing (공식문서) ■ Transformation 연산자들 map : 옵저버블에 연산자 매핑. 함수를 적용하여 옵저버블로 실행되는 데이터의 특성 또는 값을 변형한다. 일대일 변환. pluck : toArray : scan : zip : ■ take 와 skip 관련 연산자들 take : 앞에서 부터 N개 takeLast : 뒤에서 부터 N개 takeWhile : ~하는 동안에 (조건문) takeUntil : 기준이 되는 스트림이 발행하기까지 발행 ※ 인자로 또 다른 스트림을 받는다. skip : 발행물 앞에서 부터 N개 건너 뛰기 skipLast : 뒤에서 부터 N개 건너 뛰기 skipWhile : ~ 하는 동안 건너 뛰기 skipUntil : 기준이 되는 스트림이 발행되고 부터 건너 뛰기 ※ 인자로 또 다른 .. 2023. 1. 13.
[Chapter#1] Lesson 4. 내맘대로 발행하는 Subject 링크: https://www.yalco.kr/@rxjs/1-4/ 흠... Subject와 Observable의 차이에 대해 설명하고 Subject의 종류에 간단히 설명하셨다. 그런데 본격적인 사용법은 chapter 3 부터 시작하신다고 한다... Observable Subject 발행 시점 누가 구독을 시작했을때 개발자가 원하는 때에 발행 데이터의 상태공유 개별적(독립적) 공유 차이점은 위 표로 간단하게 설명할 수 있을 것 같다. const subject = new Subject() const obs$ = interval(1000) obs$.subscribe(subject) subject.subscribe(x => console.log('바로구독: ' + x)) setTimeout(_ => { subje.. 2023. 1. 12.
[Chapter#1] Lesson 3. Operator 사용해보기 링크: https://www.yalco.kr/@rxjs/1-3/ 연산자의 종류는 크게 두 가지로 나뉜다. 1. Creation Operators - RxJS에서 제공하는 메서드(range, from, of...)로 observable을 생성하는 연산자. 2. Pipable Operators - RxJS.operator에서 로드된. - 현존하는 데이터를 수정하지 않는 "순수함수"로 observable을 가공. - pipe 함수에 하나 이상 넣어 연결 2023. 1. 12.
[Chapter#1] Lesson 2. Observer(구독자)에게 발행물 구독시키기 링크: https://www.yalco.kr/@rxjs/1-1/ observer는 사전적인 의미로 "관찰자"이다. 그리고 구독자는 영어로 "subscriber"이다. RxJS를 공부하면서 앞에 두 단어를 같이 사용하면서 설명하는 분들이 많아서 였다. 결론 부터 말하자면 두 개는 같다. ■ observer의 형태 const { from } = rxjs const observable$ = from([1, 2, 3, 4, 5]) const observer = { next: (x) => console.log(x), error: err => console.error('발행중 오류', err), complete: () => console.log('발행물 완결'), } // [1] observer를 객체로 선언하고 .. 2023. 1. 12.
[Chapter#1] Lesson 1. Observable(스트림 생성기) 만들기 (5가지) 링크: https://www.yalco.kr/@rxjs/1-1/ 1. 배열된 스트림 (of, from, range, generate) - 시간에 구애를 받지 않는 1차원적인, 평면적인 스트림. const obs1$ = of(1, 2, 3, 4, 5) // 인자 자체가 각각 값으로 출력된다. // 결과: 1, 2, 3, 4, 5 const obs2$ = from([6, 7, 8, 9, 10]) // 배열을 인자로 받아 배열에 들어있는 요소 하나하나가 출력된다.( ~부터) // 결과: 6, 7, 8, 9, 10 const obs3$ = range(11, 5) // 첫 번째 인자는 시작 위치, 두 번째 인자는 n번째 까지를 나타낸다. (범위) // 결과: 11, 12, 13, 14, 15 const obs4$.. 2023. 1. 12.

티스토리툴바