[RxSwift] Observable, Operators 그리고 subscribe

- 단방향 데이터 플로우 아키텍처에 적용시키기 유리함

- 반응형앱으로 만들기 위해서 프로젝트를 새로 만들 필요는 없음(일부의 코드들을 간단하게 만들고, 새로운 기능들을 RxSwift로 정의하면 되겠다)

- MVVM + RxSwift 조합

ㄴ ViewModel Observable<T> 프로퍼티를 방출하게 하는데 이는 View controller의 고정된 코드에서 UIKit controls가 직접적으로 바인드 되게 할 수 있음 -> Observable<T> 프로퍼티를 사용해서 UIKit의 Controls 요소를 옵저빙 할 수 있음

 

Podfile에서 2022년 1월 기준 아래 pod 추가

    pod 'RxSwift', '6.1.0'
    pod 'RxCocoa', '6.1.0'

pod install 로 설치 완료 후 프로젝트 재 실행.

mvvm과 swift의 조합이 좋다고 하는데 아직 잘 모르겠당. 폴더 분리!

xib에서 스위치를 하나 생성하여 constraint 주고 swift 파일과 IBOutlet 연결

@IBOutlet weak var rxSwitch: UISwitch!

swift 파일에서 RxSwift와 RxCocoa를 import 해준다 주의해야 할 점은 RxCocoa를 해주어야 Rx에서 웬만한 uikit 구현해 놓은 기능을 쓸 수 있으므로 잊지 말고 import 해준당 RxSwift 만 해주고 버전 문제로 안되는 줄 알고 어쩌지 했는데 임포트만 잘 해주면 되는거였당

import UIKit
import RxSwift
import RxCocoa

class SwitchTestViewController: UIViewController {

    @IBOutlet weak var rxSwitch: UISwitch!
    
    override func viewDidLoad() {
        super.viewDidLoad()
        
        rxSwitch.rx.isOn
            .subscribe { isOn in
                print(isOn ? "스위치 켜짐" : "스위치 꺼짐")
            }
        
    }
}

import UIKit 제거해줘도 됨.

이렇게 해주면 control을 옵저빙 한 것 처럼 사용 가능함

UITextField, URLSession, UIViewController에서도 사용 가능. rx 네임스페이스로 리액티브 익스텐션 사용자 정의가 가능함

 

Observables

- observable == observable sequence == sequence 

특히 RxSwift에서는 stream이라는 단어가 아닌 sequence로 사용

- observable이야 말로 시퀀스! 비동기에서 사용할 수 있는 엄청난 힘을 가지고 있다고 함 

- Observables는 일정 기간 동안 방출이라고 하는 event를 발생시킴

- 이벤트는 값을 포함할 수 있으며 숫자나 커스텀 타입의 인스턴스도 포함되며 탭을 눌러 제스처를 인식하는 것도 이 이벤트에 포함된다 위에서 스위치가 그래서 가능한 것

 

RxSwift에서 사용되는 마블 다이어그램은 아래 사이트에서 쉽게 확인 가능함

https://rxmarbles.com/

RxMarbles: Interactive diagrams of Rx Observables

-> 화살표는 시간을 나타내고 숫자가 적혀 있는 동그라미는 sequence를 나타냄 여기서 시퀀스란 앞에서 말한 observable를 의미하는 것으로 보면 됨

 

여기서 1이 방출되고 시간이 조금 흐르면 2가 방출되고 그 다음 3, 그 다음 4가 방출되는 것을 타임 라인으로 표시 해 둔 것!

Observable의 이벤트에는 세가지가 있는데

.next, .completed, .error 가 있다. 여기서 .completed 를 살펴보자면

화살표 마지막에 있는 세로 막대기는 observable의 끝을 의미함

여기서 observable은 4개의 이벤트를 방출하고 끝남 이것을 completed 이벤트라고 함

이 타임라인에서 시퀀스는 이미 화면에서 사라져 보이지 않는 dismiss 된 뷰에  존재하고 있을 수도 있다! 이때는 사용하지 않는 이벤트이므로 메모리에 남겨둘 필요가 없어 즉시 종료시키는 것이 중요하다. 또한 이 observable이 더 이상 이벤트를 방출하지도 않으므로 정상적으로 종료시키는 것이 필요하게 된다. 만약에 정상적으로 종료가 안되었을 때 사용할 수 있는 것이 error 이다

terminate 시킬 수 있는 이벤트는 두 가지 인데 하나는 completion이고 다른 하나는 error 인 셈이다.

에러 이벤트는 화살표 선상에서 x로 표시된다

에러이벤트가 방출되면 즉시 observable은 종료되고 더 이상 아무것도 방출할 수 없다

 

terminated이벤트가 방출되면 더 이상 이벤트를 방출할 수 없음!

 

 

어느 이벤트가 있는지는 Pods의 RxSwift 에서 Event.swift <- 이 안에서 확인할 수 있다

        rxSwitch.rx.isOn
            .subscribe { isOn in
                print(isOn)
            } onError: { error in
                print(error.localizedDescription)
            } onCompleted: {
                print("completed")
            } onDisposed: {
                print("disposed")
            }

error 타입이 Swift Error 타입이기 때문에 localizedDescription로 찍어 볼 수 있음 

 

이제 Observable을 생성하는 'Operator'에 대해서 알아보겠음!

Observable.XXX() 와 같은 메소드를 RxSwift에서는 Operator라고 한다! 뭐가 있는지 살펴 보고 싶다면 cheat sheet도 있당!

https://cheatography.com/donghua-li/cheat-sheets/rxswift-operators/

RxSwift Operators Cheat Sheet

 

우선 하나의 요소를 담은 Observable sequence를 생성하는 오퍼레이터는 just 이다!

        let dog = 0
        let cat = 1
        let bird = 2
        
        let animalObservable = Observable<Int>.just(dog)

이렇게 생성해 줄 수 있다. cheat sheet를 살펴보면 'emit a particular item'이라고 적혀있는데 특정한 아이템을 방출하는 옵저버블을 생성할 수 있다!

 

그 다음 살펴볼 것은 of 인데 이것은 just와 달리 여러 요소를 담은 Observable  시퀀스를 생성한다

let animalsObservable = Observable.of(dog, cat, bird)

요로코롬 생성해 주면 되겠다! 만약에 of 오퍼레이터에 인자로 들어간 dog, cat, bird 값이 Int 타입이면 옵저버블의 Element는 int 타입인 것! 만약에 파라미터로 혹은 전달된는 값을 어레이로 주고 싶다면 

let animalsObservable = Observable.of([dog, cat, bird])

이렇게 해주어야 한다! 그렇다면 내가 어레이로 가지고 있는 데이터가 있고 이 데이터를 하나하나 옵저버로 만들고 싶다! 할 때 하나하나 해줘야 할까? 노놉 이미 from이라는 오퍼레이터가 있다!

위에서 of로 생성한 옵저버의 반환 값을 보면

int 어레임을 알 수 있다! 즉 생성한 것은 [Int] 타입의 옵저버!

let animalsObservable = Observable.of([dog, cat, bird])
        
let animalObservables = Observable.from([dog, cat, bird])

그런데 만약 from으로 생성한다? (위에는 of, 밑에는 from)

그러면 결과 값은

이러하다! Int 타입의 옵저버가 생성된 것을 알 수 잇는데 enumerable 시퀀스를 인자로 받아서 어레이를 옵저버로 생성한다. from 은 무조건 파라미터로 어레이 타입을 받는다!

정리>>>

of 에서 Element가 [Int] 이면 결과는 Observable<[Int]>

from 에서 Element가 [Int] 이면 결과는  Observable<Int>

사실 잘 이해 안되는게 어레이를 넣었는데 결과가 어떻게 한개 나오는 건지 신기하당 이런건 다른거 보면서 익히다가 나중에 어! 하면서 알게되는 것이 최고임

 

그런데 빌드해보면 아무것도 나오지 않는다! why? 바로 구독을 안했기 때문!

Observable은 이름 그대로 옵저빙 가능한 친구인데 이 친구의 값을 받아보고 싶으면 구독해줘야 함! 유튜브랑 비슷한 건가 보다. 유튜버가 Observable이고 여기 새 동영상이 올라오면 Element인거고 이거에 대한 알림을 받고 싶다 그러면 구독 좋아요 알림 설정 해주는 건가보당  예시가 정확하지 않을 수 있지만...

 

Subscribing

우선 이전에 observable에서 중요하게 생각해야 할 부분은 observable 은 이벤트를 보내지 않는다는 것이다! 말그대로 옵저버만 생성해 놓은 상태! 이제 여기서 이 옵저버를 구독하는 subscriber가 생겨야 이벤트를 send! 하게 되는 것

중요한 사항은 Observable은 시퀀스라는 것이다. observable을 구독한다(subscribing)  는 것은 Swift Standard library 에서 interator의 next()를 호출하는 것과 같다

 

        let dog = "멍멍"
        let cat = "야옹"
        let bird = "췍췍"
        
        let animalSoundObservable = Observable.of(dog, cat, bird)

of 로 Event<String> 옵저버블을 생성해 준다! subscribe를 보면 

이렇게 되어 있당 파라미터로 Event<String>을 넘겨주고 Disposable을 반환 받을 수 있다

dispose 해주지 않아도 콘솔에 completed가 찍히는 것을 볼 수 있당 그래도 노란줄 지워 주려고 아직 잘 모르는 DisposeBag()로 옵저버를 종료시키도록 해주었다

        let disposebag = DisposeBag()
        
        animalSoundObservable.subscribe { event in
            print(event)
        }.disposed(by: disposebag)

그러면 이제 옵저버의 각 요소를 콘솔에 프린트 하는 것을 볼 수 있다.

앞에서 살펴 봤듯이 세가지 이벤트가 있는데 (.next, .completed, .error)

옵저버블이 .next 이벤트를 방출하는 것을 알 수 있다. 여기서 .completed 이벤트가 방출되고 즉시 해당 시퀀스는 종료 되는 것!

그렇다면 여기서 of와 from의 차이를 테스트 해볼 수 있당

어레이가 아닌 각 요소를 넣어준 of 오퍼레이터는 봤으니  of의 파라미터로 어레이를 보내 주면

 

next(["멍멍", "야옹", "췍췍"])

completed

 

가 찍히는 것을 볼 수 있다. 즉 next는 한번만 방출 (어레이 전체에 대해) 그 후 completed 이벤트 방출

되었다는 것 이제 from을 찍어보면

 

next(멍멍)

next(야옹)

next(췍췍)

completed

 

of 오퍼레이터에 요소를 각각 적어준 것과 같은 결과를 얻을 수 있다! 

아직 subscribe를 다 보지 못해서 잘 모르겠지만 몇 개인지 내용물이 뭔지 알지 못하는 어레이를 가지고 있다! 타입만 안다 하면 from을 쓰면 되겠고 각각의 구성요소를 알고 몇개 안된다 하면 of를 쓰면 되겠다 싶다.

next()로 찍히는 것은 이벤트를 프린트 해서 그렇고 값을 프린트 하고 싶다면 next 이벤트의 element를 사용하면 된다 

ex> event.element 

 

이벤트가 아닌 이벤트의 값을 받고 싶다면 아래와 같이 onNext를 사용하면 된다!

Event<Element>가 아닌 Element를 클로저의 값으로 받을 수 있다

 

        animalSoundObservable.subscribe(onNext: { element in
            print(element)
        })

콘솔을 보면 알 수 있지만 completed 가 되는 것을 알 수 있다. 절대 종료되지 않아야 하는 경우 즉 completed, error 이벤트가 발생하지 않아야 하는 경우 never 오퍼레이터를 사용할 수 있다

어떠한 아이템도 방출하지 않고 절대 종료되지도 않는 옵저버블을 생성할 수 있다. 

        let neverObservable = Observable<Any>.never()
        neverObservable.subscribe(onNext: { element in
            print(element)
        }, onCompleted: {
            print("never observable completed") // 출력안됨
        })

onCompleted 구문에 적은 문구가  출력되지 않는 것을 확인할 수 있는데 never 오퍼레이터는 종료되지 않는 옵저버블을 생성하기 때문! 그리고 어떠한 element도 없다

 

그렇다면 방출되는 element는 없지만 즉시 종료되어야 하는 경우에는  empty 오퍼레이터를 사용할 수 있다! 어디에 쓰이는지는 잘 모르겠음

        let emptyObservable = Observable<Void>.empty()
        emptyObservable.subscribe(onNext: { event in
            print(event)
        }, onCompleted: {
            print("completed")
        }).disposed(by: disposebag)

즉시 종료되어 콘솔에 completed가 찍히는 것을 확인할 수있당

(궁금한건 반환되는 element가 없다고 하는데 이것이 nil을 의미하는게 아니라 완전히 무의 상태를 의미하는 거겠지?? )

 

range는 for문 처럼 사용 가능하당

        let rangeObservable = Observable<Int>.range(start: 1, count: 10)
        rangeObservable.subscribe(onNext: { i in
            print("현재 값은? : \(i)")
        })

참고 도서 : RxSwift reactive programming with swift - raywenderlich

 

문제시 댓글로 알려주시면 감사하겠습니다!

공부하면서 적다보니 틀린 내용이 있을 수 있습니다 ㅠㅠ