New to transformation operators? Check out the article Get started transforming streams with map, pluck, and mapTo!
ββββ
Example 1: Add 10 to each number
( StackBlitz | jsBin | jsFiddle )
// RxJS v6+import { from } from 'rxjs';import { map } from 'rxjs/operators';β//emit (1,2,3,4,5)const source = from([1, 2, 3, 4, 5]);//add 10 to each valueconst example = source.pipe(map(val => val + 10));//output: 11,12,13,14,15const subscribe = example.subscribe(val => console.log(val));
Example 2: Map to single property
( StackBlitz | jsBin | jsFiddle )
// RxJS v6+import { from } from 'rxjs';import { map } from 'rxjs/operators';β//emit ({name: 'Joe', age: 30}, {name: 'Frank', age: 20},{name: 'Ryan', age: 50})const source = from([{ name: 'Joe', age: 30 },{ name: 'Frank', age: 20 },{ name: 'Ryan', age: 50 }]);//grab each persons name, could also use pluck for this scenarioconst example = source.pipe(map(({ name }) => name));//output: "Joe","Frank","Ryan"const subscribe = example.subscribe(val => console.log(val));
βAlphabet Invasion Gameβ
βBattleship Gameβ
βCatch The Dot Gameβ
βGame Loopβ
βHTTP Pollingβ
βLockscreenβ
βMemory Gameβ
βMine Sweeper Gameβ
βSave Indicatorβ
βSmart Counterβ
βSpace Invaders Gameβ
βStop Watchβ
βSwipe To Refreshβ
βTetris Gameβ
βType Aheadβ
βmap π° - Official docs
βmap - In Depth Dev Reference
βmap vs flatMap π₯ - Ben
Lesh
βTransformation operator: map and mapTo π₯ π΅ - AndrΓ© Staltz
βBuild your own map operator π₯ - Kwinten Pisman
π Source Code: https://github.com/ReactiveX/rxjs/blob/master/src/internal/operators/map.tsβ