Skip to content
This repository was archived by the owner on Oct 1, 2018. It is now read-only.

Commit 9f34fc2

Browse files
Merge branch 'master' into add-docs-for-let
2 parents 58d64ef + 4aae5d3 commit 9f34fc2

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

41 files changed

+1160
-234
lines changed

src/operator-docs/combination/combineAll.ts

Lines changed: 13 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -51,12 +51,19 @@ export const combineAll: OperatorDoc = {
5151
name:
5252
'Map two click events to a finite interval Observable, then apply <span class="markdown-code">combineAll</span>',
5353
code: `
54-
const clicks = Rx.Observable.fromEvent(document, 'click');
55-
const higherOrder = clicks.map(ev =>
56-
Rx.Observable.interval(Math.random()*2000).take(3)
57-
)
58-
.take(2);
59-
const result = higherOrder.combineAll();
54+
import { map, combineAll, take } from 'rxjs/operators';
55+
import { fromEvent } from 'rxjs/observable/fromEvent';
56+
57+
const clicks = fromEvent(document, 'click');
58+
const higherOrder = clicks.pipe(
59+
map(ev =>
60+
interval(Math.random()*2000).pipe(take(3))
61+
),
62+
take(2)
63+
);
64+
const result = higherOrder.pipe(
65+
combineAll()
66+
);
6067
result.subscribe(x => console.log(x));
6168
`,
6269
externalLink: {

src/operator-docs/combination/combineLatest.ts

Lines changed: 8 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -56,9 +56,14 @@ export const combineLatest: OperatorDoc = {
5656
name:
5757
'Dynamically calculate the Body-Mass Index from an Observable of weight and one for height',
5858
code: `
59-
const weight = Rx.Observable.of(70, 72, 76, 79, 75);
60-
const height = Rx.Observable.of(1.76, 1.77, 1.78);
61-
const bmi = weight.combineLatest(height, (w, h) => w / (h * h));
59+
import { combineLatest } from 'rxjs/operators;
60+
import { of } from 'rxjs/observable/of';
61+
62+
const weight = of(70, 72, 76, 79, 75);
63+
const height = of(1.76, 1.77, 1.78);
64+
const bmi = weight.pipe(
65+
combineLatest(height, (w, h) => w / (h * h))
66+
);
6267
/*
6368
Output:
6469
BMI is 24.212293388429753

src/operator-docs/combination/concat.ts

Lines changed: 15 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -78,9 +78,14 @@ export const concat: OperatorDoc = {
7878
name:
7979
'Concatenate a timer counting from 0 to 3 with a synchronous sequence from 1 to 10',
8080
code: `
81-
const timer = Rx.Observable.interval(1000).take(4);
82-
const sequence = Rx.Observable.range(1, 10);
83-
const result = Rx.Observable.concat(timer, sequence);
81+
import { take } from 'rxjs/operators';
82+
import { interval } from 'rxjs/observable/interval';
83+
import { range } from 'rxjs/observable/range';
84+
import { concat } from 'rxjs/observable/concat';
85+
86+
const timer = interval(1000).pipe(take(4));
87+
const sequence = range(1, 10);
88+
const result = concat(timer, sequence);
8489
result.subscribe(x => console.log(x));
8590
8691
// results in:
@@ -94,10 +99,13 @@ export const concat: OperatorDoc = {
9499
{
95100
name: 'Concatenate an array of 3 Observables',
96101
code: `
97-
const timer1 = Rx.Observable.interval(1000).take(10);
98-
const timer2 = Rx.Observable.interval(2000).take(6);
99-
const timer3 = Rx.Observable.interval(500).take(10);
100-
const result = timer1.concat(timer2, timer3);
102+
import { take, concat } from 'rxjs/operators';
103+
import { interval } from 'rxjs/observable/interval';
104+
105+
const timer1 = interval(1000).pipe(take(10));
106+
const timer2 = interval(2000).pipe(take(6));
107+
const timer3 = interval(500).pipe(take(10));
108+
const result = timer1.pipe(concat(timer2, timer3));
101109
result.subscribe(x => console.log(x));
102110
103111
// results in the following:

src/operator-docs/combination/concatAll.ts

Lines changed: 9 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -42,9 +42,15 @@ export const concatAll: OperatorDoc = {
4242
name:
4343
'For each click event, tick every second from 0 to 3, with no concurrency',
4444
code: `
45-
const clicks = Rx.Observable.fromEvent(document, 'click');
46-
const higherOrder = clicks.map(ev => Rx.Observable.interval(1000).take(4));
47-
const firstOrder = higherOrder.concatAll();
45+
import { map, take, concatAll } from 'rxjs/operators';
46+
import { fromEvent } from 'rxjs/observable/fromEvent';
47+
import { interval } from 'rxjs/observable/interval';
48+
49+
const clicks = fromEvent(document, 'click');
50+
const higherOrder = clicks.pipe(
51+
map(ev => interval(1000).pipe(take(4)))
52+
);
53+
const firstOrder = higherOrder.pipe(concatAll());
4854
firstOrder.subscribe(x => console.log(x));
4955
`,
5056
externalLink: {

src/operator-docs/combination/forkJoin.ts

Lines changed: 13 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -73,9 +73,12 @@ export const forkJoin: OperatorDoc = {
7373
{
7474
name: 'Use forkJoin with operator emitting immediately',
7575
code: `
76-
const observable = Rx.Observable.forkJoin(
77-
Rx.Observable.of(1, 2, 3, 4),
78-
Rx.Observable.of(5, 6, 7, 8)
76+
import { forkJoin } from 'rxjs/observable/forkJoin';
77+
import { of } from 'rxjs/observable/of';
78+
79+
const observable = forkJoin(
80+
of(1, 2, 3, 4),
81+
of(5, 6, 7, 8)
7982
);
8083
observable.subscribe(
8184
value => console.log(value),
@@ -94,9 +97,13 @@ export const forkJoin: OperatorDoc = {
9497
{
9598
name: 'Use forkJoin with operator emitting after some time',
9699
code: `
97-
const observable = Rx.Observable.forkJoin(
98-
Rx.Observable.interval(1000).take(3), // emit 0, 1, 2 every second and complete
99-
Rx.Observable.interval(500).take(4) // emit 0, 1, 2, 3 every half a second and complete
100+
import { take } from 'rxjs/operators';
101+
import { forkJoin } from 'rxjs/observable/forkJoin';
102+
import { interval } from 'rxjs/observable/interval';
103+
104+
const observable = forkJoin(
105+
interval(1000).pipe(take(3)), // emit 0, 1, 2 every second and complete
106+
interval(500).pipe(take(4)) // emit 0, 1, 2, 3 every half a second and complete
100107
);
101108
observable.subscribe(
102109
value => console.log(value),

src/operator-docs/combination/merge.ts

Lines changed: 15 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -46,9 +46,13 @@ export const merge: OperatorDoc = {
4646
{
4747
name: 'Merge together two Observables: 1s interval and clicks',
4848
code: `
49-
const clicks = Rx.Observable.fromEvent(document, 'click');
50-
const timer = Rx.Observable.interval(1000);
51-
const clicksOrTimer = clicks.merge(timer);
49+
import { merge } from 'rxjs/operators';
50+
import { fromEvent } from 'rxjs/observable/fromEvent';
51+
import { interval } from 'rxjs/observable/interval';
52+
53+
const clicks = fromEvent(document, 'click');
54+
const timer = interval(1000);
55+
const clicksOrTimer = clicks.pipe(merge(timer));
5256
clicksOrTimer.subscribe(x => console.log(x));
5357
`,
5458
externalLink: {
@@ -59,11 +63,15 @@ export const merge: OperatorDoc = {
5963
{
6064
name: 'Merge together 3 Observables, but only 2 run concurrently',
6165
code: `
62-
const timer1 = Rx.Observable.interval(1000).take(10);
63-
const timer2 = Rx.Observable.interval(2000).take(6);
64-
const timer3 = Rx.Observable.interval(500).take(10);
66+
import { take } from 'rxjs/operators';
67+
import { merge } from 'rxjs/observable/merge';
68+
import { interval } from 'rxjs/observable/interval';
69+
70+
const timer1 = interval(1000).pipe(take(10));
71+
const timer2 = interval(2000).pipe(take(6));
72+
const timer3 = interval(500).pipe(take(10));
6573
const concurrent = 2; // the argument
66-
const merged = timer1.merge(timer2, timer3, concurrent);
74+
const merged = timer1.pipe(merge(timer2, timer3, concurrent));
6775
merged.subscribe(x => console.log(x));
6876
`,
6977
externalLink: {

src/operator-docs/combination/mergeAll.ts

Lines changed: 16 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -38,9 +38,13 @@ export const mergeAll: OperatorDoc = {
3838
name:
3939
'Spawn a new interval Observable for each click event, and blend their outputs as one Observable',
4040
code: `
41-
const clicks = Rx.Observable.fromEvent(document, 'click');
42-
const higherOrder = clicks.map((ev) => Rx.Observable.interval(1000));
43-
const firstOrder = higherOrder.mergeAll();
41+
import { mergeAll, map } from 'rxjs/operators';
42+
import { fromEvent } from 'rxjs/observable/fromEvent';
43+
import { interval } from 'rxjs/observable/interval';
44+
45+
const clicks = fromEvent(document, 'click');
46+
const higherOrder = clicks.pipe(map((ev) => interval(1000)));
47+
const firstOrder = higherOrder.pipe(mergeAll());
4448
firstOrder.subscribe(x => console.log(x));
4549
`,
4650
externalLink: {
@@ -52,9 +56,15 @@ export const mergeAll: OperatorDoc = {
5256
name:
5357
'Count from 0 to 9 every second for each click, but only allow 2 concurrent timers',
5458
code: `
55-
const clicks = Rx.Observable.fromEvent(document, 'click');
56-
const higherOrder = clicks.map((ev) => Rx.Observable.interval(1000).take(10));
57-
const firstOrder = higherOrder.mergeAll(2);
59+
import { mergeAll, map } from 'rxjs/operators';
60+
import { fromEvent } from 'rxjs/observable/fromEvent';
61+
import { interval } from 'rxjs/observable/interval';
62+
63+
const clicks = fromEvent(document, 'click');
64+
const higherOrder = clicks.pipe(
65+
map((ev) => interval(1000).pipe(take(10)))
66+
);
67+
const firstOrder = higherOrder.pipe(mergeAll(2));
5868
firstOrder.subscribe(x => console.log(x));
5969
`,
6070
externalLink: {

src/operator-docs/combination/pairwise.ts

Lines changed: 14 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -30,15 +30,20 @@ export const pairwise: OperatorDoc = {
3030
name:
3131
'On every click (starting from the second), emit the relative distance to the previous click',
3232
code: `
33-
const clicks = Rx.Observable.fromEvent(document, 'click');
34-
const pairs = clicks.pairwise();
35-
const distance = pairs.map(pair => {
36-
const x0 = pair[0].clientX;
37-
const y0 = pair[0].clientY;
38-
const x1 = pair[1].clientX;
39-
const y1 = pair[1].clientY;
40-
return Math.sqrt(Math.pow(x0 - x1, 2) + Math.pow(y0 - y1, 2));
41-
});
33+
import { pairwise, map } from 'rxjs/operators';
34+
import { fromEvent } from 'rxjs/observable/fromEvent';
35+
36+
const clicks = fromEvent(document, 'click');
37+
const pairs = clicks.pipe(pairwise());
38+
const distance = pairs.pipe(
39+
map(pair => {
40+
const x0 = pair[0].clientX;
41+
const y0 = pair[0].clientY;
42+
const x1 = pair[1].clientX;
43+
const y1 = pair[1].clientY;
44+
return Math.sqrt(Math.pow(x0 - x1, 2) + Math.pow(y0 - y1, 2));
45+
})
46+
);
4247
distance.subscribe(x => console.log(x));
4348
`,
4449
externalLink: {

src/operator-docs/combination/withLatestFrom.ts

Lines changed: 9 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -31,9 +31,15 @@ export const withLatestFrom: OperatorDoc = {
3131
name:
3232
'For each click event, tick every second from 0 to 3, with no concurrency',
3333
code: `
34-
const clicks = Rx.Observable.fromEvent(document, 'click');
35-
const higherOrder = clicks.map(ev => Rx.Observable.interval(1000).take(4));
36-
const firstOrder = higherOrder.concatAll();
34+
import { take, concatAll, map } from 'rxjs/operators';
35+
import { fromEvent } from 'rxjs/observable/fromEvent';
36+
import { interval } from 'rxjs/observable/interval';
37+
38+
const clicks = fromEvent(document, 'click');
39+
const higherOrder = clicks.pipe(
40+
map(ev => interval(1000).pipe(take(4)))
41+
);
42+
const firstOrder = higherOrder.pipe(concatAll());
3743
firstOrder.subscribe(x => console.log(x));
3844
`,
3945
externalLink: {

src/operator-docs/creation/empty.ts

Lines changed: 36 additions & 19 deletions
Original file line numberDiff line numberDiff line change
@@ -27,39 +27,56 @@ export const empty: OperatorDoc = {
2727
examples: [
2828
{
2929
name: 'Observable completes immediately',
30-
code: `const observable = Rx.Observable.empty();
31-
const subscription = observable.subscribe({
32-
next: () => console.log('next'), // does not log anything
33-
complete: () => console.log('complete'), // logs 'complete'
34-
});`,
30+
code: `
31+
import { empty } from 'rxjs/observable/empty';
32+
33+
const observable = empty();
34+
const subscription = observable.subscribe({
35+
next: () => console.log('next'), // does not log anything
36+
complete: () => console.log('complete'), // logs 'complete'
37+
});
38+
`,
3539
externalLink: {
3640
platform: 'JSBin',
3741
url: 'http://jsbin.com/hojacunecu/1/embed?js,console,output'
3842
}
3943
},
4044
{
4145
name: 'Observable emits initial value then completes',
42-
code: `const observable = Rx.Observable.empty().startWith('initial value');
43-
const subscription = observable.subscribe({
44-
next: (val) => console.log(\`next: \${val}\`), // logs 'next: initial value'
45-
complete: () => console.log('complete'), // logs 'complete'
46-
});`,
46+
code: `
47+
import { startWith } from 'rxjs/operators';
48+
import { empty } from 'rxjs/observable/empty';
49+
50+
const observable = empty().pipe(startWith('initial value'));
51+
const subscription = observable.subscribe({
52+
next: (val) => console.log(\`next: \${val}\`), // logs 'next: initial value'
53+
complete: () => console.log('complete'), // logs 'complete'
54+
});
55+
`,
4756
externalLink: {
4857
platform: 'JSBin',
4958
url: 'http://jsbin.com/tubonoradi/1/embed?js,console,output'
5059
}
5160
},
5261
{
5362
name: `Map and flatten only odd numbers to the sequence 'ax', 'bx', 'cx'`,
54-
code: `const source = Rx.Observable.of(1, 2, 3, 4, 5, 6, 7, 8, 9);
55-
const result = source.mergeMap(
56-
x => x % 2 === 1 ? Rx.Observable.of(\`a\${x}\`, \`b\${x}\`, \`c\${x}\`) :
57-
Rx.Observable.empty()
58-
);
59-
const subscription = result.subscribe({
60-
next: (x) => console.log(x), // logs result values
61-
complete: () => console.log('complete'), // logs 'complete'
62-
});`,
63+
code: `
64+
import { mergeMap } from 'rxjs/operators';
65+
import { of } from 'rxjs/observable/of';
66+
import { empty } from 'rxjs/observable/empty';
67+
68+
const source = of(1, 2, 3, 4, 5, 6, 7, 8, 9);
69+
const result = source.pipe(
70+
mergeMap(
71+
x => x % 2 === 1 ? of(\`a\${x}\`, \`b\${x}\`, \`c\${x}\`) :
72+
empty()
73+
)
74+
);
75+
const subscription = result.subscribe({
76+
next: (x) => console.log(x), // logs result values
77+
complete: () => console.log('complete'), // logs 'complete'
78+
});
79+
`,
6380
externalLink: {
6481
platform: 'JSBin',
6582
url: 'http://jsbin.com/qazabojiri/embed?js,console,output'

0 commit comments

Comments
 (0)