본문 바로가기

RxJS22

[RxJS / angular] 13. 옵저버블 데이터 스트림 결합, 결합 연산자 유형 여러 데이터를 반응적으로 사용하는 방법 중 하나는 다수의 옵저버블의 방출 항목을 결합해 하나의 방출 세트로 결합하는 것입니다. 이번 포스트에서는 옵저버블의 스트림을 결합하는 방법에 대해 알아보도록 하겠습니다. 스트림을 결합하는 이유 데이터 스트림을 결합을 통해 여러가지 편리한 작업을 할 수 있습니다. 첫 번째로 스트림 결합을 통해 연관 있는 두 데이터를 매핑해 줄 수 있습니다. 예를 들어 ID값을 특정 문자열과 매핑하려면 ID 정보가 있는 데이터 스트림과 특정 문자열 정보가 있는 데이터 스트림을 병합해서 ID에 해당하는 문자열을 매핑할 수 있습니다. 두 번째로 스트림을 결합해서 여러 데이터 소스를 통해 보다 유용하고 포괄적인 정보를 하나의 스트림으로 제공할 수 있습니다. 예를 들어 "제품" 데이터 스트림.. 2022. 7. 14.
[RxJS / angular] 12. http response 매핑하기(포멧 바꾸기) 서버에서 받은 데이터가 우리 화면에 적합한 데이터 포맷이 아닌 경우가 많이 있습니다. 이번 포스트에서는 서버에서 반환되는 데이터를 프론트엔드에서 사용되는 포맷을 바꾸어 매핑하는 기술을 살펴보도록 하겠습니다. 데이터 매핑 작업의 필요성 백엔드 서버에서 반환된 데이터를 매핑하는 이유는 여러가지가 있습니다. 예를 들어 상품의 가격에 이벤트로 값을 10% 인하하거나 인상할 수도 있습니다. 또는 바인딩을 쉽게 하기 위해서 'Y'값을 true로 'N'값을 false로 변경할 수도 있습니다. 그리고 필드 이름을 변경하기 위해 매핑을 해야 하는 상황도 있습니다. map 연산자 매핑작업에는 map연산자를 사용하게 됩니다. 이전 포스트에서 map연산자를 사용해서 옵저버블에서 방출된 각 항목을 변환하는 방법에 대해 알아보았.. 2022. 7. 13.
[RxJS / angular] 11. 옵저버블 에러 처리 전략 지난 포스트에서 옵저버블 에러를 처리하는 세 단계를 이야기했습니다. 이번 포스트에서 에러를 catch 하고 난 후에 어떤 처리를 할 수 있는지 에러 처리 전략에 대해 이야기해 보도록 하겠습니다. 옵저버블 에러 처리 전략 http request를 할 때는 에러가 발생할 수 있는 여러 상황이 있습니다. 예를 들어 url이 잘못됐거나, 권한이 없거나 연결 문제가 발생할 수 있습니다. 따라서 HTTP request를 발행할 때마다 에러 처리를 추가하는 것이 좋습니다. 지난 포스트에서 다뤘던 옵저버블 에러를 처리하기 위한 단계를 기억하시나요? 첫 번째로 에러를 catch합니다. 두 번째로 선택적으로 에러를 throw 합니다. 세 번째로 에러가 난 옵저버블을 새 옵저버블로 바꿔줍니다. 에러를 잡기 위해 파이프라인에.. 2022. 7. 12.
[RxJS / angular] 10. 옵저버블 에러 처리 (catchError, throwError, EMPTY) 옵저버블 에러 처리 옵저버블도 다른 코드들과 마찬가지로 에러가 발생할 수 있는 여러 시나리오가 있습니다. 예를 들어 Http 리퀘스트를 하기위해 옵저버블을 사용하게 되고 리퀘스트가 실패하고 에러가 발생할 수 있습니다. 따라서 옵저버블 에러가 프로그램에 영향을 미치지 않게 하기 위해서 에러를 처리하는 게 매우 중요합니다. 에러가 발생하면 옵저버블이 중지된다는 것을 잘 염두해야 합니다. 즉 옵저버블에 에러가 발생하면 더 이상 항목은 방출되지 않고 사용할 수 없습니다. 옵저버블에 에러를 처리하기 위해서 일반적으로 세 단계로 분류해서 생각해 볼 수 있습니다. 옵저버블 에러를 처리하는 세 단계 1. 에러 Catch 하기 먼저 에러를 잡아냅니다. 발생한 에러를 catch 함으로 프로그램 내에서 처리되지 않은 에러가.. 2022. 7. 8.