본문 바로가기

RxJava

[RxJava] 마블 다이어그램

안녕하세요. 메로나입니다.

 

오늘은 마블다이어그램에 대해 공부하겠습니다.

 

공부하기 앞서 왜 공부를 하게 되었냐면 RxJAVA를 모르는 상태에서 이미 RxJAVA로 작성된 코드를 이해하려다 어떤 함수인지 찾아보는 과정에서 마블 다이어그램을 보았는데 하나도 모르겠어서 공부하게 되었습니다. (아래 사진 참고)

android studio 에서 나오는 설명 그림

 

마블 다이어그램이란?

리액티브 프로그래밍을 통해 발생하는 비동기적인 데이터의 흐름을 시간의 흐름에 따라 시각적으로 표시한 다이어그램입니다.

 

마블 다이어그램을 볼 줄 알아야 하는 이유

ReativeX 공식 문서를 보면 filter() 함수에 이렇게 정의가 되어 있습니다. (아래 사진 참고)

ReativeX 공식문서 - filter

 

영어도 못 하는데... 번역하면 이해하기가 더 어려웠습니다.

 

ReativeX 공식문서 - filter

 

filter() 함수를 설명한 후에 다이어그램이 나오는데 다이어그램을 볼 줄 알면 이해가 좀 더 쉬웠습니다.

 

마블 다이어그램 어떻게 보나요?

1. 연산자 적용 전

ReativeX 공식문서 - filter (상단 그림)

  • 왼쪽에서 오른쪽으로 시간순으로 흐릅니다. 또한 시간순으로 데이터가 발행됩니다.
  • 1, 25, 9, 15, 7, 30 이라는 데이터를 Observable이 발행하는 데이터들입니다.
  • 발행한 데이터들이 연산자 함수로 순차적으로 들어가게 됩니다.

2. 연산자 함수

ReativeX 공식문서 - filter (연산자 함수)

  • 발행 전 데이터는 해당 연산자 함수를 통해 연산을 하게 됩니다.
  • 연산 완료 시 함수의 출력으로 내보냅니다.

3. 연산자 적용 후

ReativeX 공식문서 - filter (하단 그림)

 

  • 연산자 함수를 거쳐 출력된 데이터들이 남아있습니다.
  • 연산 전 데이터들과 동일하게 타임라인은 왼쪽에서 오른쪽으로 시간이 흐릅니다.

 

마블 다이어그램을 공부한 후에 아래 사진을 보았을 때 이해가 좀 쉬웠던 것 같습니다.

android studio 에서 나오는 설명 그림

 

참고 문헌

https://reactivex.io/documentation/operators/filter.html

 

ReactiveX - Filter operator

RxJS implements this operator under two names, but with identical behavior: filter and where. This operator takes two parameters: the predicate function, and an optional object that will represent that function’s “this” context when it executes. The

reactivex.io

'RxJava' 카테고리의 다른 글

[RxJava] 생성 연산자  (0) 2025.01.30
[RxJava] Single vs Maybe vs Completable  (0) 2025.01.27
[RxJava] Flowable과 Observable의 차이점  (0) 2025.01.23
[RxJava] Reative Streams  (0) 2025.01.22
[RxJava] 리액티브 프로그래밍  (0) 2025.01.19