RxJS 배우기
  • 소개
  • RxJS 배우기
    • 연산자
      • Combination
        • combineAll
        • combineLatest
        • concat
        • concatAll
        • endWith
        • forkJoin
        • merge
        • mergeAll
        • pairwise
        • race
        • startWith
        • withLatestFrom
        • zip
      • Conditional
        • defaultIfEmpty
        • every
        • iif
        • sequenceEqual
      • Creation
        • ajax
        • create
        • defer
        • empty
        • from
        • fromEvent
        • generate
        • interval
        • of
        • range
        • throw
        • timer
      • Error Handling
        • catch / catchError
        • retry
        • retryWhen
      • Multicasting
        • publish
        • multicast
        • share
        • shareReplay
      • Filtering
        • audit
        • auditTime
        • debounce
        • debounceTime
        • distinct
        • distinctUntilChanged
        • distinctUntilKeyChanged
        • filter
        • find
        • first
        • ignoreElements
        • last
        • sample
        • single
        • skip
        • skipUntil
        • skipWhile
        • take
        • takeLast
        • takeUntil
        • takeWhile
        • throttle
        • throttleTime
      • Transformation
        • buffer
        • bufferCount
        • bufferTime
        • bufferToggle
        • bufferWhen
        • concatMap
        • concatMapTo
        • exhaustMap
        • expand
        • groupBy
        • map
        • mapTo
        • mergeMap / flatMap
        • mergeScan
        • partition
        • pluck
        • reduce
        • scan
        • switchMap
        • switchMapTo
        • toArray
        • window
        • windowCount
        • windowTime
        • windowToggle
        • windowWhen
      • Utility
        • tap / do
        • delay
        • delayWhen
        • dematerialize
        • finalize / finally
        • let
        • repeat
        • timeInterval
        • timeout
        • timeoutWith
        • toPromise
      • 전체 목록
    • Subjects
      • AsyncSubject
      • BehaviorSubject
      • ReplaySubject
      • Subject
    • 사용예시
      • Alphabet Invasion Game
      • Battleship Game
      • Breakout Game
      • Car Racing Game
      • Catch The Dot Game
      • Click Ninja Game
      • Flappy Bird Game
      • Game Loop
      • Horizontal Scroll Indicator
      • Http Polling
      • Lockscreen
      • Matrix Digital Rain
      • Memory Game
      • Mine Sweeper Game
      • Platform Jumper Game
      • Progress Bar
      • Save Indicator
      • Smart Counter
      • Space Invaders Game
      • Stop Watch
      • Swipe To Refresh
      • Tank Battle Game
      • Tetris Game
      • Type Ahead
      • Uncover Image Game
    • 개념
      • RxJS 입문서
      • RxJS v5 -> v6 업그레이드
      • 시간 기반의 연산자 비교
      • 연산자 imports의 이해
Powered by GitBook
On this page
  • 부작용없이 로깅과 같은 액션을 수행합니다.
  • 예시
  • 관련된 사용법
  • 추가 자료

Was this helpful?

  1. RxJS 배우기
  2. 연산자
  3. Utility

tap / do

PreviousUtilityNextdelay

Last updated 5 years ago

Was this helpful?

signature: tap(nextOrObserver: function, error: function, complete: function): Observable

부작용없이 로깅과 같은 액션을 수행합니다.

pipeable 연산자를 사용중이라면, do 대신 tap 을 사용하세요!

예시

예시 1: tap을 사용하여 로그찍기

( | | )

// RxJS v6+
import { of } from 'rxjs';
import { tap, map } from 'rxjs/operators';

const source = of(1, 2, 3, 4, 5);
// 'tap'을 사용하여 소스로부터 로그 값을 찍습니다.
const example = source.pipe(
  tap(val => console.log(`BEFORE MAP: ${val}`)),
  map(val => val + 10),
  tap(val => console.log(`AFTER MAP: ${val}`))
);

//'tap'은 값을 바꾸지 않습니다.
//결과: 11...12...13...14...15
const subscribe = example.subscribe(val => console.log(val));

예시 2: 객체에서 tap 사용하기

// RxJS v6+
import { of } from 'rxjs';
import { tap, map } from 'rxjs/operators';

const source = of(1, 2, 3, 4, 5);

// tap은 next, error, complete을 사용할 수 있습니다
const example = source
  .pipe(
    map(val => val + 10),
    tap({
      next: val => {
        // on next 11 이 찍힙니다.
        console.log('on next', val);
      },
      error: error => {
        console.log('on error', error.message);
      },
      complete: () => console.log('on complete')
    })
  )
  // 결과: 11, 12, 13, 14, 15
  .subscribe(val => console.log(val));

관련된 사용법

  • [Save Indicator]('../../recipes/save-indicator.md)

추가 자료

( )

- 공식 문서

- John Linquist

- André Staltz

- Kwinten Pisman

Source Code:

💡
StackBlitz
jsBin
jsFiddle
StackBlitz
Battleship Game
Breakout Game
Car Racing Game
Catch The Dot Game
Click Ninja Game
Flappy Bird Game
Horizontal Scroll Indicator
Lockscreen
Memory Game
Mine Sweeper Game
Platform Jumper Game
Space Invaders Game
Stop Watch
Swipe To Refresh
Tank Battle Game
Tetris Game
Type Ahead
Uncover Image Game
📰
tap
📹
💵
Logging a stream with do
📹
💵
Utility operator: do
📹
Build your own tap operator
📂
https://github.com/ReactiveX/rxjs/blob/master/src/internal/operators/do.ts