Recommended
More Related Content
Similar to Reactive Programming with Rxjs
Similar to Reactive Programming with Rxjs (20)
More from SangHun Lee
More from SangHun Lee (20)
Reactive Programming with Rxjs
- 2. 비동기 데이터 스트림에 기반을 둔 프로그래밍 패턴 데이터 스트림: 연속적인 데이트의 흐름, 리액티브 프로그래밍은 기본적으로 모든 것을 데이터 스트림 으로 본다 배열 데이터 ajax 통신 결과 마우스 클릭 이벤트 … Reactive Programming
- 3. 유연한 비동기 처리 방식 한 번에 다수의 연속성을 갖는 데이터를 처리할 수 있음 서버로 보낸 요청은 취소할 수 있음 다양한 데이터 유형 처리 ajax 통신 결과, 마우스 클릭 이벤트, 배열 및 함수 반환값 등 모든 데이터를 Observable로 만들어 일관된 처리 방식을 제공 Reactive Programming
- 4. pull scenario: 어플리케이션이 외부 환경에 명령하여 원하는 결과를 응답받고 처리 push scenario: 어플리케이션이 외부 환경에 명령하고 응답이 오기까지 기다리지 않고 외부에서 응답이 오면 그때 반응하여 처리 제어의 흐름을 통제할 권한을 외부 환경으로 넘김으 로써 응답 대기 비용을 줄일 수 있어 비동기 처리에 유리하다 push scenario
- 5. Observable 외부 환경에서 어플리케이션 내부로 연속해서 흐르 는 데이터 데이터 스트림을 생성, 방출하는 객체 Observer Observable이 방출한 정보를 획득하고 사용하는 객 체 Observable & Observer
- 6. Observable 외부 환경에서 어플리케이션 내부로 연속해서 흐르 는 데이터 데이터 스트림을 생성, 방출하는 객체 Observer Observable이 방출한 정보를 획득하고 사용하는 객 체 Observable & Observer https://www.dunebook.com/reactive- programming-with-angular-2/
- 7. Observable은 구독되기 전까지 동작하지 않음 Observer가 구독을 시작하면 Observable이 갖는 데이 터의 처음부터 받기 시작 Observable이 방출하는 모든 데이터를 구독하는 시 점에 상관없이 모두 받는다 Cold Observable
- 8. Observable은 구독되기 전까지 동작하지 않음 Observer가 구독하면 처음부터 동작하기 시작 Observable이 방출하는 모든 데이터 스트림을 빠짐 없이 처음부터 받을 수 있다 하나의 Observable을 구독하는 다수의 Observer들 은 Observable이 방출하는 모든 데이터를 구독하는 시점에 상관없이 처음부터 모두 받을 수 있다 Cold Observable https://medium.com/@felice.geracitano/multicasted-observables-in-rxjs-b39e0c66837f
- 9. Observable을 구독하는 모든 Observer는 해당 Observer를 위해 독립적으로 실행하는 Observable을 가짐 유니캐스트 방식 Cold Observable
- 10. Observable을 생성하자마자 구독과 상관없이 바로 데 이터 스트림을 방출하기 시작 일정 시간이 지난 시점에 Observable을 구독하면 데 이트 스트림의 이전 부분은 구독할 수 없다 Hot Observable
- 11. Observable을 생성하자마자 구독과 상관없이 바로 데 이터 스트림을 방출하기 시작 일정 시간이 지난 시점에 Observable을 구독하면 데 이트 스트림의 이전 부분은 구독할 수 없다 Hot Observable https://medium.com/@felice.geracitano/multicasted-observables-in-rxjs-b39e0c66837f
- 12. Subject를 사용하여 Hot Observable을 구현 Subject는 Observable이면서 Observer Observable을 구독할 수 있으면서 Observer처럼 next, complete 메소드를 호출 할 수 있다. Observable을 구독하고 있는 모든 Observer에게 사이 드 이팩트가 있음 멀티캐스트 방식 Hot Observable
- 13. Unicast & Multicast Cold Observable: one to one Hot Observable: one to many https://techdifferences.com/difference-between-unicast-and-multicast.html
- 14. Observable을 생성, 변환, 필터링, 결합, 에러 처리, 집 계 연산 등의 기능을 하는 함수 Operator의 반환형은 모두 Observable이기 때문에 Operator들을 연달아 호출할 수 있는 체이닝 방식이 가능 Operator
- 15. Observable을 생성, 변환, 필터링, 결합, 에러 처리, 집 계 연산 등의 기능을 하는 함수 Operator의 반환형은 모두 Observable이기 때문에 Operator들을 연달아 호출할 수 있는 체이닝 방식이 가능 Operator http://reactivex.io/ documentation/operators.html
- 16. Operator 활용 예시: http://tech.kakao.com/2017/01/09/daummovie-rxjs/ 마블 다이어그램: http://rxmarbles.com/ Operator
- 17. 각기 다른 유형의 데이터 스트림을 일관된 방식으로 처리한 다는 점이 개발을 하는데 있어 신경쓸 것을 하나 없앤 느낌. 복잡하거나 까다로울 수 있는 데이터 스트림 처리를 적절한 오퍼레이터 조합으로 쉽고 명료하게 할 수 있었다 Subject, Scheduler 등의 개념부터는 이해하기가 쉽지 않 다. 다소 러닝커브가 있다. rxjs 모듈을 임폴트하는 것이 번거롭고 길었었는데 rxjs6 부 터는 내부구조가 바뀌어 Observable, Subject, pipe, operators등의 임폴트하는 방식이 명료해졌다. I felt that..