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. Combination

startWith

PreviousraceNextwithLatestFrom

Last updated 4 years ago

Was this helpful?

signature: startWith(an: Values): Observable

주어진 값을 처음으로 방출합니다.

또한 초기값부터 시작할 수 있습니다!

예시

( )

예시 1: 연속된 숫자와 startWith 사용하기

( | | )

// RxJS v6+
import { startWith } from 'rxjs/operators';
import { of } from 'rxjs';

//방출 (1,2,3)
const source = of(1, 2, 3);
// 0부터 시작
const example = source.pipe(startWith(0));
//결과: 0,1,2,3
const subscribe = example.subscribe(val => console.log(val));

예시 2: scan한 값과 startWith사용하기

// RxJS v6+
import { startWith, scan } from 'rxjs/operators';
import { of } from 'rxjs';

//방출 ('World!', 'Goodbye', 'World!')
const source = of('World!', 'Goodbye', 'World!');
// 'Hello'부터 시작하고, 이전값과 현재값 concat하기
const example = source.pipe(
  startWith('Hello'),
  scan((acc, curr) => `${acc} ${curr}`)
);
/*
  결과:
  "Hello"
  "Hello World!"
  "Hello World! Goodbye"
  "Hello World! Goodbye World!"
*/
const subscribe = example.subscribe(val => console.log(val));

예시 3: 복수의 값들을 startWith로 사용하기

// RxJS v6+
import { startWith } from 'rxjs/operators';
import { interval } from 'rxjs';

//매 1초마다 값 내보내기
const source = interval(1000);
// -3, -2, -1부터 시작하기
const example = source.pipe(startWith(-3, -2, -1));
//결과: -3, -2, -1, 0, 1, 2....
const subscribe = example.subscribe(val => console.log(val));

관련한 사용법

추가 자료

( | | | )

( | | )

- 공식 문서

- John Linquist

- André Staltz

- André Staltz

Source Code:

📰
📹
💵
📹
💵
📹
💵
💡
BehaviorSubject
예시 테스트
StackBlitz
jsBin
jsFiddle
StackBlitz
jsBin
jsFiddle
StackBlitz
jsBin
jsFiddle
Alphabet Invasion Game
Breakout Game
Car Racing Game
Platform Jumper Game
Smart Counter
Space Invaders Game
Stop Watch
Tank Battle Game
Tetris Game
Uncover Image Game
startWith
Displaying initial data with startWith
Clear data while loading with startWith
Combination operator: concat, startWith
📂
https://github.com/ReactiveX/rxjs/blob/master/src/internal/operators/startWith.ts