ืึทืกื™ื ื˜ืฉืจืึธื ืึธื•ืก ืคึผืจืึธื’ืจืึทืžืžื™ื ื’ ืื™ืŸ ื“ื–ืฉืึทื•ื•ืึทืกืงืจื™ืคึผื˜ (ืงืึธืœื‘ืึทืง, ืคึผืจืึธืžื™ืกืข, RxJs)

ื ื’ื•ื˜ืŸ ื™ืขื“ืขืจ. ืกืขืจื’ื™ื™ ืึธืžืขืœื ื™ืฆืงื™ ืื™ื– ืื™ืŸ ืงืึธื ื˜ืึทืงื˜. ื ื™ื˜ ืœืึทื ื’ ืฆื•ืจื™ืง ืื™ืš ื›ืึธื•ืกื˜ื™ื“ ืึท ื˜ื™ื™ึทืš ืื•ื™ืฃ ืจื™ืึทืงื˜ื™ื•ื• ืคึผืจืึธื’ืจืึทืžืžื™ื ื’, ื•ื•ื• ืื™ืš ื’ืขืจืขื“ื˜ ื•ื•ืขื’ืŸ ื™ื™ืกื™ื ื’ืงืจืึทื ื™ ืื™ืŸ ื“ื–ืฉืึทื•ื•ืึทืกืงืจื™ืคึผื˜. ื”ื™ื™ึทื ื˜ ืื™ืš ื•ื•ืึธืœื˜ ื•ื•ื™ ืฆื• ื ืขืžืขืŸ ื”ืขืจื•ืช ืื•ื™ืฃ ื“ืขื ืžืึทื˜ืขืจื™ืึทืœ.

ืึทืกื™ื ื˜ืฉืจืึธื ืึธื•ืก ืคึผืจืึธื’ืจืึทืžืžื™ื ื’ ืื™ืŸ ื“ื–ืฉืึทื•ื•ืึทืกืงืจื™ืคึผื˜ (ืงืึธืœื‘ืึทืง, ืคึผืจืึธืžื™ืกืข, RxJs)

ืื‘ืขืจ ืื™ื™ื“ืขืจ ืžื™ืจ ืึธื ื”ื™ื™ื‘ืŸ ื“ื™ ื”ื•ื™ืคึผื˜ ืžืึทื˜ืขืจื™ืึทืœ, ืžื™ืจ ื“ืึทืจืคึฟืŸ ืฆื• ืžืึทื›ืŸ ืึท ื™ื ื˜ืจืึทื“ืึทืงื˜ืขืจื™ ื˜ืึธืŸ. ืœืึธืžื™ืจ ืึธื ื”ื™ื™ื‘ืŸ ืžื™ื˜ ื“ืขืคึฟื™ื ื™ืฆื™ืขืก: ื•ื•ืึธืก ืื™ื– ืึท ืึธื ืœื™ื™ื’ืŸ ืื•ืŸ ืึท ืจื™ื™?

ืึธื ืœื™ื™ื’ืŸ ืื™ื– ืึท ื–ืึทืžืœื•ื ื’ ื•ื•ืขืžืขื ืก ืขืœืขืžืขื ื˜ืŸ ื–ืขื ืขืŸ ื‘ืืงื•ืžืขืŸ ืื•ื™ืฃ ืึท ืœืขืฆื˜ืข-ืื™ืŸ, ืขืจืฉื˜ืขืจ-ืื•ื™ืก LIFO ื™ืงืขืจ

ื“ืจื™ื™ืขืŸ ืื™ื– ืึท ื–ืึทืžืœื•ื ื’ ื•ื•ืขืžืขื ืก ืขืœืขืžืขื ื˜ืŸ ื–ืขื ืขืŸ ื‘ืืงื•ืžืขืŸ ืื•ื™ืฃ ืึท ืขืจืฉื˜ืขืจ-ืื™ืŸ, ืขืจืฉื˜ืขืจ-ืื•ื™ืก FIFO ื™ืงืขืจ

ืึธื•ืงื™ื™, ืœืึธืžื™ืจ ืคืึธืจื–ืขืฆืŸ.

ืึทืกื™ื ื˜ืฉืจืึธื ืึธื•ืก ืคึผืจืึธื’ืจืึทืžืžื™ื ื’ ืื™ืŸ ื“ื–ืฉืึทื•ื•ืึทืกืงืจื™ืคึผื˜ (ืงืึธืœื‘ืึทืง, ืคึผืจืึธืžื™ืกืข, RxJs)

ื“ื–ืฉืึทื•ื•ืึทืกืงืจื™ืคึผื˜ ืื™ื– ืึท ืื™ื™ืŸ-ืคืึธื“ืขื ืคึผืจืึธื’ืจืึทืžืžื™ื ื’ ืฉืคึผืจืึทืš. ื“ืขื ืžื™ื˜ืœ ืึทื– ืขืก ืื™ื– ื‘ืœื•ื™ื– ืื™ื™ืŸ ืคืึธื“ืขื ืคื•ืŸ ื“ื•ืจื›ืคื™ืจื•ื ื’ ืื•ืŸ ืื™ื™ืŸ ืึธื ืœื™ื™ื’ืŸ ืื•ื™ืฃ ื•ื•ืึธืก ืคืึทื ื’ืงืฉืึทื ื– ื–ืขื ืขืŸ ืงื™ื• ืคึฟืึทืจ ื“ื•ืจื›ืคื™ืจื•ื ื’. ื“ืขืจื™ื‘ืขืจ, ื“ื–ืฉืึทื•ื•ืึทืกืงืจื™ืคึผื˜ ืงืขื ืขืŸ ื‘ืœื•ื™ื– ื“ื•ืจื›ืคื™ืจืŸ ืื™ื™ืŸ ืึธืคึผืขืจืึทืฆื™ืข ืื™ืŸ ืึท ืฆื™ื™ึทื˜, ื‘ืฉืขืช ืื ื“ืขืจืข ืึทืคึผืขืจื™ื™ืฉืึทื ื– ื•ื•ืขื˜ ื•ื•ืึทืจื˜ืŸ ื–ื™ื™ืขืจ ืงืขืจ ืื•ื™ืฃ ื“ื™ ืึธื ืœื™ื™ื’ืŸ ื‘ื™ื– ื–ื™ื™ ื–ืขื ืขืŸ ื’ืขืจื•ืคึฟืŸ.

ืจื•ืคืŸ ืึธื ืœื™ื™ื’ืŸ ืื™ื– ืึท ื“ืึทื˜ืŸ ืกื˜ืจื•ืงื˜ื•ืจ ื•ื•ืึธืก, ืคืฉื•ื˜ ืฉื˜ืขืœืŸ, ืจืขืงืึธืจื“ื™ืจืŸ ืื™ื ืคึฟืึธืจืžืึทืฆื™ืข ื•ื•ืขื’ืŸ ื“ืขื ืึธืจื˜ ืื™ืŸ ื“ื™ ืคึผืจืึธื’ืจืึทื ื•ื•ื• ืžื™ืจ ื–ืขื ืขืŸ. ืื•ื™ื‘ ืžื™ืจ ืคืึธืจืŸ ืื™ืŸ ืึท ืคึฟื•ื ืงืฆื™ืข, ืžื™ืจ ืฉื˜ื•ืคึผืŸ ื–ื™ื™ึทืŸ ืคึผืึธื–ื™ืฆื™ืข ืฆื• ื“ื™ ืฉืคึผื™ืฅ ืคื•ืŸ ื“ื™ ืึธื ืœื™ื™ื’ืŸ. ื•ื•ืขืŸ ืžื™ืจ ืฆื•ืจื™ืงืงื•ืžืขืŸ ืคื•ืŸ ืึท ืคึฟื•ื ืงืฆื™ืข, ืžื™ืจ ืงื ืึทืœ ื“ื™ ืฉืคึผื™ืฅ ืขืœืขืžืขื ื˜ ืคื•ืŸ ื“ืขื ืึธื ืœื™ื™ื’ืŸ ืื•ืŸ ืกื•ืฃ ืึทืจื•ื™ืฃ ืฆื•ืจื™ืง ื•ื•ื• ืžื™ืจ ื’ืขืจื•ืคืŸ ื“ื™ ืคึฟื•ื ืงืฆื™ืข. ื“ืึธืก ืื™ื– ืึทืœืข ื•ื•ืึธืก ื“ืขืจ ืกื˜ืึทืง ืงืขื ืขืŸ ื˜ืึธืŸ. ืื•ืŸ ืื™ืฆื˜ ืึท ื’ืึธืจ ื˜ืฉื™ืงืึทื•ื•ืข ืงืฉื™ื. ื•ื•ื™ ืึทื–ื•ื™ ืึทืจื‘ืขื˜ ื™ื™ืกื™ื ื’ืงืจืึทื ื™ ืื™ืŸ ื“ื–ืฉืึทื•ื•ืึทืกืงืจื™ืคึผื˜?

ืึทืกื™ื ื˜ืฉืจืึธื ืึธื•ืก ืคึผืจืึธื’ืจืึทืžืžื™ื ื’ ืื™ืŸ ื“ื–ืฉืึทื•ื•ืึทืกืงืจื™ืคึผื˜ (ืงืึธืœื‘ืึทืง, ืคึผืจืึธืžื™ืกืข, RxJs)

ืื™ืŸ ืึทื“ื™ืฉืึทืŸ ืฆื• ื“ืขื ืึธื ืœื™ื™ื’ืŸ, ื‘ืจืึทื•ื–ืขืจื– ื”ืึธื‘ืŸ ืึท ืกืคึผืขืฆื™ืขืœ ืจื™ื™ ืคึฟืึทืจ ืืจื‘ืขื˜ืŸ ืžื™ื˜ ื“ื™ ืึทื–ื•ื™ ื’ืขืจื•ืคืขื ืข ื•ื•ืขื‘ืึทืคึผื™. ื“ื™ ืคืึทื ื’ืงืฉืึทื ื– ืื™ืŸ ื“ืขื ืจื™ื™ ื•ื•ืขื˜ ื–ื™ื™ืŸ ืขืงืกืึทืงื™ื•ื˜ืึทื“ ืื™ืŸ ืกื“ืจ ื‘ืœื•ื™ื– ื ืึธืš ื“ื™ ืึธื ืœื™ื™ื’ืŸ ืื™ื– ื’ืึธืจ ืงืœื™ืจื“. ื‘ืœื•ื™ื– ื ืึธืš ื“ืขื ื–ืขื ืขืŸ ื–ื™ื™ ืคึผื•ืฉื˜ ืคื•ืŸ ื“ื™ ืจื™ื™ ืึทื ื˜ื• ื“ื™ ืึธื ืœื™ื™ื’ืŸ ืคึฟืึทืจ ื“ื•ืจื›ืคื™ืจื•ื ื’. ืื•ื™ื‘ ืขืก ืื™ื– ื‘ื™ื™ึท ืžื™ื ื“ืกื˜ืขืจ ืื™ื™ืŸ ืขืœืขืžืขื ื˜ ืื•ื™ืฃ ื“ืขื ืึธื ืœื™ื™ื’ืŸ ืื™ืŸ ื“ืขื ืžืึธืžืขื ื˜, ื–ื™ื™ ืงืขื ืขืŸ ื ื™ื˜ ื–ื™ื™ืŸ ืžื•ืกื™ืฃ ืฆื• ื“ืขื ืึธื ืœื™ื™ื’ืŸ. ืขืก ืื™ื– ืคึผื•ื ืงื˜ ื•ื•ื™ื™ึทืœ ืคื•ืŸ ื“ืขื ืึทื– ืจื•ืคืŸ ืคืึทื ื’ืงืฉืึทื ื– ื“ื•ืจืš ื˜ื™ื™ืžืึทื•ื˜ ืื™ื– ืึธืคื˜ ื ื™ืฉื˜ ื’ืขื ื•ื™ ืื™ืŸ ืฆื™ื™ื˜, ื•ื•ื™ื™ึทืœ ื“ื™ ืคึฟื•ื ืงืฆื™ืข ืงืขืŸ ื ื™ืฉื˜ ื‘ืึทืงื•ืžืขืŸ ืคื•ืŸ ื“ื™ ืจื™ื™ ืฆื• ื“ื™ ืึธื ืœื™ื™ื’ืŸ ื‘ืฉืขืช ืขืก ืื™ื– ืคื•ืœ.

ืœืึธืžื™ืจ ืงื•ืงืŸ ืื™ืŸ ื“ื™ ืคืืœื’ืขื ื“ืข ื‘ื™ื™ืฉืคึผื™ืœ ืื•ืŸ ืึธื ื”ื™ื™ื‘ืŸ ืžื™ื˜ ื“ื™ ื™ืžืคึผืœืึทืžืขื ื˜ื™ื™ืฉืึทืŸ ืคื•ืŸ ื“ืขื ืฉืจื™ื˜-ื“ื•ืจืš-ืฉืจื™ื˜. ืœืึธืžื™ืจ ืื•ื™ืš ื–ืขืŸ ื•ื•ืึธืก ื›ืึทืคึผืึทื ื– ืื™ืŸ ื“ื™ ืกื™ืกื˜ืขื.

console.log('Hi');
setTimeout(function cb1() {
    console.log('cb1');
}, 5000);
console.log('Bye');

ืึทืกื™ื ื˜ืฉืจืึธื ืึธื•ืก ืคึผืจืึธื’ืจืึทืžืžื™ื ื’ ืื™ืŸ ื“ื–ืฉืึทื•ื•ืึทืกืงืจื™ืคึผื˜ (ืงืึธืœื‘ืึทืง, ืคึผืจืึธืžื™ืกืข, RxJs)

1) ื’ืึธืจื ื™ืฉื˜ ืื™ื– ื’ืขืฉืขืขื ื™ืฉ ื ืึธืš. ื“ืขืจ ื‘ืœืขื˜ืขืจืขืจ ืงืึทื ืกืึธื•ืœ ืื™ื– ืงืœืึธืจ, ื“ื™ ืจื•ืคืŸ ืึธื ืœื™ื™ื’ืŸ ืื™ื– ืœื™ื™ื“ื™ืง.

ืึทืกื™ื ื˜ืฉืจืึธื ืึธื•ืก ืคึผืจืึธื’ืจืึทืžืžื™ื ื’ ืื™ืŸ ื“ื–ืฉืึทื•ื•ืึทืกืงืจื™ืคึผื˜ (ืงืึธืœื‘ืึทืง, ืคึผืจืึธืžื™ืกืข, RxJs)

2) ื“ืขืจื ืึธืš ื“ื™ ื‘ืึทืคึฟืขืœ console.log ('ื”ื™') ืื™ื– ืžื•ืกื™ืฃ ืฆื• ื“ื™ ืจื•ืคืŸ ืึธื ืœื™ื™ื’ืŸ.

ืึทืกื™ื ื˜ืฉืจืึธื ืึธื•ืก ืคึผืจืึธื’ืจืึทืžืžื™ื ื’ ืื™ืŸ ื“ื–ืฉืึทื•ื•ืึทืกืงืจื™ืคึผื˜ (ืงืึธืœื‘ืึทืง, ืคึผืจืึธืžื™ืกืข, RxJs)

3) ืื•ืŸ ืขืก ืื™ื– ืžืงื•ื™ื

ืึทืกื™ื ื˜ืฉืจืึธื ืึธื•ืก ืคึผืจืึธื’ืจืึทืžืžื™ื ื’ ืื™ืŸ ื“ื–ืฉืึทื•ื•ืึทืกืงืจื™ืคึผื˜ (ืงืึธืœื‘ืึทืง, ืคึผืจืึธืžื™ืกืข, RxJs)

4) ื“ืขืจื ืึธืš console.log ('ื”ื™') ืื™ื– ืึทื•ื•ืขืงื’ืขื ื•ืžืขืŸ ืคื•ืŸ ื“ื™ ืจื•ืคืŸ ืึธื ืœื™ื™ื’ืŸ.

ืึทืกื™ื ื˜ืฉืจืึธื ืึธื•ืก ืคึผืจืึธื’ืจืึทืžืžื™ื ื’ ืื™ืŸ ื“ื–ืฉืึทื•ื•ืึทืกืงืจื™ืคึผื˜ (ืงืึธืœื‘ืึทืง, ืคึผืจืึธืžื™ืกืข, RxJs)

5) ืื™ืฆื˜ ืžืึทืš ืื•ื™ืฃ ืฆื• ื“ื™ ื‘ืึทืคึฟืขืœ setTimeout (ืคื•ื ืงืฆื™ืข cb1 () {... }). ืขืก ืื™ื– ืžื•ืกื™ืฃ ืฆื• ื“ื™ ืจื•ืคืŸ ืึธื ืœื™ื™ื’ืŸ.

ืึทืกื™ื ื˜ืฉืจืึธื ืึธื•ืก ืคึผืจืึธื’ืจืึทืžืžื™ื ื’ ืื™ืŸ ื“ื–ืฉืึทื•ื•ืึทืกืงืจื™ืคึผื˜ (ืงืึธืœื‘ืึทืง, ืคึผืจืึธืžื™ืกืข, RxJs)

6) ื“ื™ setTimeout (ืคื•ื ืงืฆื™ืข cb1 () {... }) ื‘ืึทืคึฟืขืœ ืื™ื– ืขืงืกืึทืงื™ื•ื˜ืึทื“. ื“ืขืจ ื‘ืœืขื˜ืขืจืขืจ ืงืจื™ื™ื™ืฅ ืึท ื˜ื™ื™ึทืžืขืจ ื•ื•ืึธืก ืื™ื– ื˜ื™ื™ืœ ืคื•ืŸ ื“ื™ ื•ื•ืขื‘ ืึทืคึผื™. ืขืก ื•ื•ืขื˜ ื“ื•ืจื›ืคื™ืจืŸ ืึท ืงืึธื•ื ื˜ื“ืึธื•ื•ืŸ.

ืึทืกื™ื ื˜ืฉืจืึธื ืึธื•ืก ืคึผืจืึธื’ืจืึทืžืžื™ื ื’ ืื™ืŸ ื“ื–ืฉืึทื•ื•ืึทืกืงืจื™ืคึผื˜ (ืงืึธืœื‘ืึทืง, ืคึผืจืึธืžื™ืกืข, RxJs)

7) ื“ืขืจ ื‘ืึทืคึฟืขืœ setTimeout (ืคื•ื ืงืฆื™ืข cb1 () {... }) ื”ืื˜ ื’ืขืขื ื“ื™ืงื˜ ื–ื™ื™ืŸ ืึทืจื‘ืขื˜ ืื•ืŸ ืื™ื– ืึทื•ื•ืขืงื’ืขื ื•ืžืขืŸ ืคื•ืŸ ื“ื™ ืจื•ืคืŸ ืึธื ืœื™ื™ื’ืŸ.

ืึทืกื™ื ื˜ืฉืจืึธื ืึธื•ืก ืคึผืจืึธื’ืจืึทืžืžื™ื ื’ ืื™ืŸ ื“ื–ืฉืึทื•ื•ืึทืกืงืจื™ืคึผื˜ (ืงืึธืœื‘ืึทืง, ืคึผืจืึธืžื™ืกืข, RxJs)

8) ื“ื™ ื‘ืึทืคึฟืขืœ console.log ('ื‘ื™ื™') ืื™ื– ืžื•ืกื™ืฃ ืฆื• ื“ื™ ืจื•ืคืŸ ืึธื ืœื™ื™ื’ืŸ.

ืึทืกื™ื ื˜ืฉืจืึธื ืึธื•ืก ืคึผืจืึธื’ืจืึทืžืžื™ื ื’ ืื™ืŸ ื“ื–ืฉืึทื•ื•ืึทืกืงืจื™ืคึผื˜ (ืงืึธืœื‘ืึทืง, ืคึผืจืึธืžื™ืกืข, RxJs)

9) ื“ื™ console.log('ื‘ื™ื™') ื‘ืึทืคึฟืขืœ ืื™ื– ืขืงืกืึทืงื™ื•ื˜ืึทื“.

ืึทืกื™ื ื˜ืฉืจืึธื ืึธื•ืก ืคึผืจืึธื’ืจืึทืžืžื™ื ื’ ืื™ืŸ ื“ื–ืฉืึทื•ื•ืึทืกืงืจื™ืคึผื˜ (ืงืึธืœื‘ืึทืง, ืคึผืจืึธืžื™ืกืข, RxJs)

10) ื“ื™ ื‘ืึทืคึฟืขืœ console.log ('ื‘ื™ื™') ืื™ื– ืึทื•ื•ืขืงื’ืขื ื•ืžืขืŸ ืคื•ืŸ ื“ื™ ืจื•ืคืŸ ืึธื ืœื™ื™ื’ืŸ.

ืึทืกื™ื ื˜ืฉืจืึธื ืึธื•ืก ืคึผืจืึธื’ืจืึทืžืžื™ื ื’ ืื™ืŸ ื“ื–ืฉืึทื•ื•ืึทืกืงืจื™ืคึผื˜ (ืงืึธืœื‘ืึทืง, ืคึผืจืึธืžื™ืกืข, RxJs)

11) ื ืึธืš ืœืคึผื—ื•ืช 5000 ืžื™ื– ื“ื•ืจื›ื’ืขื’ืื ื’ืขืŸ, ื“ื™ ื˜ื™ื™ึทืžืขืจ ื˜ืขืจืžืึทื ื™ื™ืฅ ืื•ืŸ ืฉื˜ืขืœืŸ ืงืึทืœืœื‘ืึทืงืง ืงื‘1 ืื™ืŸ ื“ื™ ืงืึทืœืœื‘ืึทืงืง ืจื™ื™.

ืึทืกื™ื ื˜ืฉืจืึธื ืึธื•ืก ืคึผืจืึธื’ืจืึทืžืžื™ื ื’ ืื™ืŸ ื“ื–ืฉืึทื•ื•ืึทืกืงืจื™ืคึผื˜ (ืงืึธืœื‘ืึทืง, ืคึผืจืึธืžื™ืกืข, RxJs)

12) ื“ื™ ื’ืขืฉืขืขื ื™ืฉ ืฉืœื™ื™ืฃ ื ืขืžื˜ ืคึฟื•ื ืงืฆื™ืข cb1 ืคึฟื•ืŸ ื“ื™ ืงืึทืœืœื‘ืึทืงืง ืจื™ื™ ืื•ืŸ ืฉื˜ืขืœืŸ ืขืก ืื•ื™ืฃ ื“ื™ ืจื•ืคืŸ ืึธื ืœื™ื™ื’ืŸ.

ืึทืกื™ื ื˜ืฉืจืึธื ืึธื•ืก ืคึผืจืึธื’ืจืึทืžืžื™ื ื’ ืื™ืŸ ื“ื–ืฉืึทื•ื•ืึทืกืงืจื™ืคึผื˜ (ืงืึธืœื‘ืึทืง, ืคึผืจืึธืžื™ืกืข, RxJs)

13) ืคึฟื•ื ืงืฆื™ืข cb1 ืื™ื– ืขืงืกืึทืงื™ื•ื˜ืึทื“ ืื•ืŸ ืžื•ืกื™ืฃ console.log ('cb1') ืฆื• ื“ื™ ืจื•ืคืŸ ืึธื ืœื™ื™ื’ืŸ.

ืึทืกื™ื ื˜ืฉืจืึธื ืึธื•ืก ืคึผืจืึธื’ืจืึทืžืžื™ื ื’ ืื™ืŸ ื“ื–ืฉืึทื•ื•ืึทืกืงืจื™ืคึผื˜ (ืงืึธืœื‘ืึทืง, ืคึผืจืึธืžื™ืกืข, RxJs)

14) ื“ื™ console.log('cb1') ื‘ืึทืคึฟืขืœ ืื™ื– ืขืงืกืึทืงื™ื•ื˜ืึทื“.

ืึทืกื™ื ื˜ืฉืจืึธื ืึธื•ืก ืคึผืจืึธื’ืจืึทืžืžื™ื ื’ ืื™ืŸ ื“ื–ืฉืึทื•ื•ืึทืกืงืจื™ืคึผื˜ (ืงืึธืœื‘ืึทืง, ืคึผืจืึธืžื™ืกืข, RxJs)

15) ื“ื™ ื‘ืึทืคึฟืขืœ console.log ('cb1') ืื™ื– ืึทื•ื•ืขืงื’ืขื ื•ืžืขืŸ ืคื•ืŸ ื“ื™ ืจื•ืคืŸ ืึธื ืœื™ื™ื’ืŸ.

ืึทืกื™ื ื˜ืฉืจืึธื ืึธื•ืก ืคึผืจืึธื’ืจืึทืžืžื™ื ื’ ืื™ืŸ ื“ื–ืฉืึทื•ื•ืึทืกืงืจื™ืคึผื˜ (ืงืึธืœื‘ืึทืง, ืคึผืจืึธืžื™ืกืข, RxJs)

16) ืคึฟื•ื ืงืฆื™ืข cb1 ืื™ื– ืึทื•ื•ืขืงื’ืขื ื•ืžืขืŸ ืคื•ืŸ ื“ื™ ืจื•ืคืŸ ืึธื ืœื™ื™ื’ืŸ.

ืœืึธืžื™ืจ ื–ืขืŸ ืึท ื‘ื™ื™ืฉืคึผื™ืœ ืื™ืŸ ื“ื™ื ืึทืžื™ืง:

ืึทืกื™ื ื˜ืฉืจืึธื ืึธื•ืก ืคึผืจืึธื’ืจืึทืžืžื™ื ื’ ืื™ืŸ ื“ื–ืฉืึทื•ื•ืึทืกืงืจื™ืคึผื˜ (ืงืึธืœื‘ืึทืง, ืคึผืจืึธืžื™ืกืข, RxJs)

ื ื•, ืžื™ืจ ื’ืขืงื•ืงื˜ ื•ื•ื™ ื™ื™ืกื™ื ื’ืงืจืึทื ื™ ืื™ื– ื™ืžืคึผืœืึทืžืขื ืึทื“ ืื™ืŸ ื“ื–ืฉืึทื•ื•ืึทืกืงืจื™ืคึผื˜. ืื™ืฆื˜ ืœืึธื–ืŸ ืก ืจืขื“ืŸ ื‘ืขืงื™ืฆืขืจ ื•ื•ืขื’ืŸ ื“ื™ ืขื•ื•ืึธืœื•ืฆื™ืข ืคื•ืŸ โ€‹โ€‹ื™ื™ืกื™ื ื’ืงืจืึทื ืึทืก ืงืึธื“.

ื“ื™ ืขื•ื•ืึธืœื•ืฆื™ืข ืคื•ืŸ โ€‹โ€‹ื™ื™ืกื™ื ื’ืงืจืึทื ืึทืก ืงืึธื“.

a(function (resultsFromA) {
    b(resultsFromA, function (resultsFromB) {
        c(resultsFromB, function (resultsFromC) {
            d(resultsFromC, function (resultsFromD) {
                e(resultsFromD, function (resultsFromE) {
                    f(resultsFromE, function (resultsFromF) {
                        console.log(resultsFromF);
                    })
                })
            })
        })
    })
});

ืึทืกื™ื ื˜ืฉืจืึธื ืึธื•ืก ืคึผืจืึธื’ืจืึทืžืžื™ื ื’ ื•ื•ื™ ืžื™ืจ ื•ื•ื™ืกืŸ ืขืก ืื™ืŸ ื“ื–ืฉืึทื•ื•ืึทืกืงืจื™ืคึผื˜ ืงืขื ืขืŸ ื–ื™ื™ืŸ ื™ืžืคึผืœืึทืžืขื ืึทื“ ื‘ืœื•ื™ื– ื“ื•ืจืš ืคืึทื ื’ืงืฉืึทื ื–. ื–ื™ื™ ืงืขื ืขืŸ ื–ื™ื™ืŸ ื“ื•ืจื›ื’ืขื’ืื ื’ืขืŸ ื•ื•ื™ ืงื™ื™ืŸ ืื ื“ืขืจืข ื•ื•ืขืจื™ืึทื‘ืึทืœื– ืฆื• ืื ื“ืขืจืข ืคืึทื ื’ืงืฉืึทื ื–. ื“ืึธืก ืื™ื– ื•ื•ื™ ืงืึทืœื‘ืึทืงืงืก ื–ืขื ืขืŸ ื’ืขื‘ื•ื™ืจืŸ. ืื•ืŸ ืขืก ืื™ื– ืงื™ืœ, ืฉืคึผืึทืก ืื•ืŸ ืฉื˜ื™ืคืขืจื™ืฉ, ื‘ื™ื– ืขืก ื˜ื•ืจื ืก ืื™ืŸ ื•ืžืขื˜, ืžืขืœืึทื ื›ืึธืœื™ืฉ ืื•ืŸ ื•ืžืขื˜. ืคืืจื•ื•ืืก? ืขืก ืื™ื– ืคึผืฉื•ื˜:

  • ื•ื•ืขืŸ ื“ื™ ืงืึทืžืคึผืœืขืงืกื™ื˜ื™ ืคื•ืŸ ื“ื™ ืงืึธื“ ื™ื ืงืจื™ืกื™ื–, ื“ื™ ืคึผืจื•ื™ืขืงื˜ ื’ืขืฉื•ื•ื™ื ื“ ื˜ื•ืจื ืก ืื™ืŸ ื˜ื•ื ืงืœ, ืจื™ืคึผื™ื˜ื™ื“ืœื™ ื ืขืกื˜ืขื“ ื‘ืœืึทืงืก - "ืงืึทืœื‘ืึทืง ื’ืขื ืขื".
  • ื˜ืขื•ืช ื”ืึทื ื“ืœื™ื ื’ ืงืขื ืขืŸ ื–ื™ื™ืŸ ื’ืจื™ื ื’ ืฆื• ืคืึทืจืคื™ืจืŸ.
  • ืื™ืจ ืงืขื ืขืŸ ื ื™ืฉื˜ ืฆื•ืจื™ืงืงื•ืžืขืŸ ืื•ื™ืกื“ืจื•ืงืŸ ืžื™ื˜ ืฆื•ืจื™ืงืงื•ืžืขืŸ.

ืžื™ื˜ ื“ื™ ืฆื•ื’ืึทื ื’ ืคื•ืŸ ืคึผืจืึธืžื™ืก, ื“ื™ ืกื™ื˜ื•ืึทืฆื™ืข ื’ืขื•ื•ืืจืŸ ืึท ื‘ื™ืกืœ ื‘ืขืกืขืจ.

new Promise(function(resolve, reject) {
    setTimeout(() => resolve(1), 2000);

}).then((result) => {
    alert(result);
    return result + 2;

}).then((result) => {
    throw new Error('FAILED HERE');
    alert(result);
    return result + 2;

}).then((result) => {
    alert(result);
    return result + 2;

}).catch((e) => {
    console.log('error: ', e);
});

  • ืฆื•ื–ืึธื’ ืงื™ื™ื˜ืŸ ืืจื•ื™ืก, ื•ื•ืึธืก ื™ืžืคึผืจื•ื•ื•ื“ ืงืึธื“ ืจื™ื“ืึทื‘ื™ืœื™ื˜ื™
  • ื ื‘ืึทื–ื•ื ื“ืขืจ ืื•ืคึฟืŸ ืคึฟืึทืจ ืงืึทื˜ืฉื™ื ื’ ืขืจืจืึธืจืก ืื™ื– ืืจื•ื™ืก
  • ืฆื•ื’ืขื’ืขื‘ืŸ ื“ื™ ืžืขื’ืœืขื›ืงื™ื™ื˜ ืคื•ืŸ ืคึผืึทืจืึทืœืขืœ ื“ื•ืจื›ืคื™ืจื•ื ื’ ื ื™ืฆืŸ Promise.all
  • ืžื™ืจ ืงืขื ืขืŸ ืกืึธืœื•ื•ืข ื ืขืกื˜ืขื“ ื™ื™ืกื™ื ื’ืงืจืึทื ื™ ื ื™ืฆืŸ ืึทืกื™ื ืง / ื“ืขืจื•ื•ืึทืจื˜ืŸ

ืื‘ืขืจ ื”ื‘ื˜ื—ื•ืช ื”ืึธื‘ืŸ ื–ื™ื™ืขืจ ืœื™ืžื™ื˜ื™ื™ืฉืึทื ื–. ืคึฟืึทืจ ื‘ื™ื™ึทืฉืคึผื™ืœ, ืึท ืฆื•ื–ืึธื’ ืงืขื ืขืŸ ื ื™ื˜ ื–ื™ื™ืŸ ืงืึทื ืกืึทืœื“ ืึธืŸ ื“ืึทื ืกื™ื ื’ ืžื™ื˜ ืึท ื˜ืึทืžื‘ื•ืจื™ืŸ, ืื•ืŸ ื•ื•ืึธืก ืื™ื– ืžืขืจืกื˜ ื•ื•ื™ื›ื˜ื™ืง ืื™ื– ืึทื– ืขืก ืึทืจื‘ืขื˜ ืžื™ื˜ ืื™ื™ืŸ ื•ื•ืขืจื˜.

ื ื•, ืžื™ืจ ื”ืึธื‘ืŸ ืกืžื•ื“ืœื™ ืึทืคึผืจืึธื•ื˜ืฉื˜ ืจื™ืึทืงื˜ื™ื•ื• ืคึผืจืึธื’ืจืึทืžืžื™ื ื’. ืžื™ื“? ื ื•, ื’ืœื™ืง, ืื™ืจ ืงืขื ืขืŸ ื’ื™ื™ืŸ ืžืึทื›ืŸ ืขื˜ืœืขื›ืข ื˜ื™ื™, ื˜ืจืึทื›ื˜ืŸ ื•ื•ืขื’ืŸ ืื™ื ืื•ืŸ ืงื•ืžืขืŸ ืฆื•ืจื™ืง ืฆื• ืœื™ื™ืขื ืขืŸ ืžืขืจ. ืื•ืŸ ืื™ืš ื•ื•ืขืœ ืคืึธืจื–ืขืฆืŸ.

ืึทืกื™ื ื˜ืฉืจืึธื ืึธื•ืก ืคึผืจืึธื’ืจืึทืžืžื™ื ื’ ืื™ืŸ ื“ื–ืฉืึทื•ื•ืึทืกืงืจื™ืคึผื˜ (ืงืึธืœื‘ืึทืง, ืคึผืจืึธืžื™ืกืข, RxJs)

ืจืขืึทืงื˜ื™ื•ื•ืข ืคึผืจืึธื’ืจืึทืžืžื™ื ื’โ€Šืื™ื– ืึท ืคึผืจืึธื’ืจืึทืžืžื™ื ื’ ืคึผืึทืจืึทื“ื™ื’ื ืคืึธื•ืงื™ืกื˜ ืื•ื™ืฃ ื“ืึทื˜ืŸ ืคืœืึธื•ื– ืื•ืŸ ื˜ื•ื™ืฉืŸ ืคึผืจืึทืคึผืึทื’ื™ื™ืฉืึทืŸ. ื–ืืœ ืก ื ืขืžืขืŸ ืึท ื ืขืขื ื˜ืขืจ ืงื•ืง ืื™ืŸ ื•ื•ืึธืก ืึท ื“ืึทื˜ืŸ ื˜ื™ื™ึทืš ืื™ื–.

// ะŸะพะปัƒั‡ะฐะตะผ ััั‹ะปะบัƒ ะฝะฐ ัะปะตะผะตะฝั‚
const input = ducument.querySelector('input');

const eventsArray = [];

// ะŸัƒัˆะธะผ ะบะฐะถะดะพะต ัะพะฑั‹ั‚ะธะต ะฒ ะผะฐััะธะฒ eventsArray
input.addEventListener('keyup',
    event => eventsArray.push(event)
);

ื–ืืœ ืก ื™ืžืึทื“ื–ืฉืึทืŸ ืึทื– ืžื™ืจ ื”ืึธื‘ืŸ ืึท ืึทืจื™ื™ึทื ืฉืจื™ื™ึทื‘ ืคืขืœื“. ืžื™ืจ ืฉืืคืŸ ืึท ืžืขื ื’ืข ืื•ืŸ ืคึฟืึทืจ ื™ืขื“ืขืจ ืงื ื•ืคึผ ืคื•ืŸ ื“ื™ ืึทืจื™ื™ึทื ืฉืจื™ื™ึทื‘ ื’ืขืฉืขืขื ื™ืฉ ืžื™ืจ ื•ื•ืขืœืŸ ืงืจืึธื ื“ื™ ื’ืขืฉืขืขื ื™ืฉ ืื™ืŸ ืื•ื ื“ื–ืขืจ ืžืขื ื’ืข. ืื™ืŸ ื“ืขืจ ื–ืขืœื‘ื™ืงืขืจ ืฆื™ื™ื˜, ืื™ืš ื•ื•ืึธืœื˜ ื•ื•ื™ ืฆื• ื˜ืึธืŸ ืึทื– ืื•ื ื“ื–ืขืจ ืžืขื ื’ืข ืื™ื– ืื•ื™ืกื’ืขืฉื˜ืขืœื˜ ืœื•ื™ื˜ ืฆื™ื™ื˜, ื“.ื”. ื“ืขืจ ืื™ื ื“ืขืงืก ืคื•ืŸ ืฉืคึผืขื˜ืขืจื“ื™ืงืข ื’ืขืฉืขืขื ื™ืฉืŸ ืื™ื– ื’ืจืขืกืขืจ ื•ื•ื™ ื“ืขืจ ืื™ื ื“ืขืงืก ืคื•ืŸ ืคืจื™ืขืจื“ื™ื’ืข. ืึทื–ืึท ืึท ืžืขื ื’ืข ืื™ื– ืึท ืกื™ืžืคึผืœืึทืคื™ื™ื“ ืžืึธื“ืขืœ ืคื•ืŸ ืึท ื“ืึทื˜ืŸ ืœื•ื™ืคืŸ, ืึธื‘ืขืจ ืขืก ืื™ื– ื ื™ืฉื˜ ื ืึธืš ืึท ืœื•ื™ืคืŸ. ื›ึผื“ื™ ื“ืขื ืžืขื ื’ืข ื–ืึธืœ ื–ื™ื™ืŸ ื’ืขืจื•ืคึฟืŸ ื‘ืขืฉืึธืœืขื ืึท ื˜ื™ื™ึทืš, ืขืก ืžื•ื–ืŸ ื–ื™ื™ืŸ ื‘ื™ื›ื•ืœืช ืฆื• ืขืคืขืก ืžื™ื˜ื˜ื™ื™ืœืŸ ืื‘ืื ืขื ื˜ืŸ ืึทื– ื ื™ื™ึท ื“ืึทื˜ืŸ ื–ืขื ืขืŸ ืื ื’ืขืงื•ืžืขืŸ ืื™ืŸ ืขืก. ืื–ื•ื™ ืžื™ืจ ืงื•ืžืขืŸ ืฆื• ื“ืขืจ ื“ืขืคึฟื™ื ื™ืฆื™ืข ืคื•ืŸ โ€‹โ€‹ืœื•ื™ืคืŸ.

ื“ืึทื˜ืŸ ื˜ื™ื™ึทืš

const { interval } = Rx;
const { take } = RxOperators;

interval(1000).pipe(
    take(4)
)

ืึทืกื™ื ื˜ืฉืจืึธื ืึธื•ืก ืคึผืจืึธื’ืจืึทืžืžื™ื ื’ ืื™ืŸ ื“ื–ืฉืึทื•ื•ืึทืกืงืจื™ืคึผื˜ (ืงืึธืœื‘ืึทืง, ืคึผืจืึธืžื™ืกืข, RxJs)

ืœื•ื™ืคืŸโ€Šืื™ื– ืึท ืžืขื ื’ืข ืคื•ืŸ โ€‹โ€‹ื“ืึทื˜ืŸ ืื•ื™ืกื’ืขืฉื˜ืขืœื˜ ืœื•ื™ื˜ ืฆื™ื™ื˜ ื•ื•ืึธืก ืงืขื ืขืŸ ืึธื ื•ื•ื™ื™ึทื–ืŸ ืึทื– ื“ื™ ื“ืึทื˜ืŸ ื”ืึธื‘ืŸ ื’ืขื‘ื™ื˜ืŸ. ืื™ืฆื˜ ื™ืžืึทื“ื–ืฉืึทืŸ ื•ื•ื™ ื‘ืึทืงื•ื•ืขื ืขืก ื•ื•ืขืจื˜ ืฆื• ืฉืจื™ื™ึทื‘ืŸ ืงืึธื“ ืื™ืŸ ื•ื•ืึธืก ืื™ื™ืŸ ืงืึทืžืฃ ืจื™ืงื•ื•ื™ื™ืขืจื– ืคืึทืš ืขื˜ืœืขื›ืข ื’ืขืฉืขืขื ื™ืฉืŸ ืื™ืŸ ืคืึทืจืฉื™ื“ืขื ืข ืคึผืึทืจืฅ ืคื•ืŸ ื“ื™ ืงืึธื“. ืžื™ืจ ืคืฉื•ื˜ ืึทื‘ืึธื ื™ืจืŸ ืฆื• ื“ืขื ื˜ื™ื™ึทืš ืื•ืŸ ืขืก ื•ื•ืขื˜ ื’ืขื‘ื  ืฆื• ื•ื•ื™ืกืŸ ืื•ื ื“ื– ื•ื•ืขืŸ ืขื ื“ืขืจื•ื ื’ืขืŸ ืคึผืึทืกื™ืจืŸ. ืื•ืŸ ื“ื™ RxJs ื‘ื™ื‘ืœื™ืึธื˜ืขืง ืงืขื ืขืŸ ื˜ืึธืŸ ื“ืึธืก.

ืึทืกื™ื ื˜ืฉืจืึธื ืึธื•ืก ืคึผืจืึธื’ืจืึทืžืžื™ื ื’ ืื™ืŸ ื“ื–ืฉืึทื•ื•ืึทืกืงืจื™ืคึผื˜ (ืงืึธืœื‘ืึทืง, ืคึผืจืึธืžื™ืกืข, RxJs)

RxJS ืื™ื– ืึท ื‘ื™ื‘ืœื™ืึธื˜ืขืง ืคึฟืึทืจ ืืจื‘ืขื˜ืŸ ืžื™ื˜ ื™ื™ืกื™ื ื’ืงืจืึทื ืึทืก ืื•ืŸ ื’ืขืฉืขืขื ื™ืฉ-ื‘ืื–ื™ืจื˜ ืžื’ื™ืœื” ื ื™ืฆืŸ ืึธื‘ืกืขืจื•ื•ืึทื‘ืœืข ืกื™ืงื•ื•ืึทื ืกื™ื–. ื“ื™ ื‘ื™ื‘ืœื™ืึธื˜ืขืง ื’ื™ื˜ ืึท ื™ืงืขืจื“ื™ืง ื˜ื™ืคึผ ืึธื‘ืกืขืจื•ื•ืึทื‘ืœืขืขื˜ืœืขื›ืข ืึทื’ื–ื™ืœื™ืขืจื™ ื˜ื™ื™ืคึผืก (ืึทื‘ื–ืขืจื•ื•ืขืจ, ืกืงืขื“ื–ืฉื•ืœืขืจื–, ืกืึทื‘ื“ื–ืฉืขืงืฅ) ืื•ืŸ ืึธืคึผืขืจื™ื™ื˜ืขืจื– ืคึฟืึทืจ ืืจื‘ืขื˜ืŸ ืžื™ื˜ ื’ืขืฉืขืขื ื™ืฉืŸ ื•ื•ื™ ืžื™ื˜ ื–ืึทืžืœื•ื ื’ืขืŸ (ืžืึทืคึผืข, ืคื™ืœื˜ืขืจ, ืจืขื“ื•ืฆื™ืจืŸ, ื™ืขื“ืขืจ ืื•ืŸ ืขื ืœืขืš ืึธื ืขืก ืคึฟื•ืŸ ื“ื–ืฉืึทื•ื•ืึทืกืงืจื™ืคึผื˜ ืึทืจืจื™ื™ึท).

ื–ืืœ ืก ืคึฟืึทืจืฉื˜ื™ื™ืŸ ื“ื™ ื’ืจื•ื ื˜ ืงืึทื ืกืขืคึผืก ืคื•ืŸ ื“ืขื ื‘ื™ื‘ืœื™ืึธื˜ืขืง.

ื‘ืืžืขืจืงื˜, ืึธื‘ืกืขืจื•ื•ืขืจ, ืคึผืจืึธื“ื•ืฆื™ืจืขืจ

ืึธื‘ืกืขืจื•ื•ืึทื‘ืœืข ืื™ื– ื“ืขืจ ืขืจืฉื˜ืขืจ ื™ืงืขืจื“ื™ืง ื˜ื™ืคึผ ื•ื•ืึธืก ืžื™ืจ ื•ื•ืขืœืŸ ืงื•ืงืŸ ืื™ืŸ. ื“ืขืจ ืงืœืึทืก ื›ึผื•ืœืœ ื“ื™ ื”ื•ื™ืคึผื˜ ื˜ื™ื™ืœ ืคื•ืŸ ื“ื™ RxJs ื™ืžืคึผืœืึทืžืขื ื˜ื™ื™ืฉืึทืŸ. ืขืก ืื™ื– ืคึฟืึทืจื‘ื•ื ื“ืŸ ืžื™ื˜ ืึท ืึทื‘ื–ืขืจื•ื•ืึทื‘ืึทืœ ื˜ื™ื™ึทืš, ื•ื•ืึธืก ืงืขื ืขืŸ ื–ื™ื™ืŸ ืึทื‘ืึธื ื™ืจืŸ ืฆื• ื ื™ืฆืŸ ื“ื™ ืึทื‘ืึธื ื™ืจืŸ ืื•ืคึฟืŸ.

ืึธื‘ืกืขืจื•ื•ืึทื‘ืœืข ื™ืžืคึผืœืึทืžืึทื ืฅ ืึท ื”ืขืœืคึผืขืจ ืžืขืงืึทื ื™ื–ืึทื ืคึฟืึทืจ ืงืจื™ื™ื™ื˜ื™ื ื’ ื“ืขืจื”ื™ื™ึทื ื˜ื™ืงื•ื ื’ืขืŸ, ื“ื™ ืึทื–ื•ื™ ื’ืขืจื•ืคืขื ืข ืึทื‘ื–ืขืจื•ื•ืขืจ. ื“ืขืจ ืžืงื•ืจ ืคื•ืŸ ื•ื•ืึทืœื•ืขืก ืคึฟืึทืจ ื“ื™ ืึธื‘ืกืขืจื•ื•ืขืจ ืื™ื– ื’ืขืจื•ืคืŸ ืคึผืจืึธื“ื•ืฆื™ืจืขืจ. ื“ืึธืก ืงืขืŸ ื–ื™ื™ืŸ ืึท ืžืขื ื’ืข, ื™ื˜ืขืจืึทื˜ืึธืจ, ื•ื•ืขื‘ ื›ืึธืœืขืœ, ืขื˜ืœืขื›ืข ืกืึธืจื˜ ืคื•ืŸ ื’ืขืฉืขืขื ื™ืฉ, ืืื–"ื• ื•. ืึทื–ื•ื™ ืžื™ืจ ืงืขื ืขืŸ ื–ืึธื’ืŸ ืึทื– ืึธื‘ืกืขืจื•ื•ืึทื‘ืœืข ืื™ื– ืึท ืึธื ืคื™ืจืขืจ ืฆื•ื•ื™ืฉืŸ ืคึผืจืึธื“ื•ืฆื™ืจืขืจ ืื•ืŸ ืึธื‘ืกืขืจื•ื•ืขืจ.

ืึธื‘ืกืขืจื•ื•ืึทื‘ืœืข ื›ืึทื ื“ืึทืœื– ื“ืจื™ื™ ื˜ื™ื™ืคึผืก ืคื•ืŸ ืึธื‘ืกืขืจื•ื•ืขืจ ื’ืขืฉืขืขื ื™ืฉืŸ:

  • ื•ื•ื™ื™ึทื˜ืขืจ - ื ื™ื™ึท ื“ืึทื˜ืŸ
  • ื˜ืขื•ืช - ืึท ื˜ืขื•ืช ืื•ื™ื‘ ื“ื™ ืกื™ืงื•ื•ืึทื ืก ืื™ื– ื’ืขืขื ื“ื™ืงื˜ ืจืขื›ื˜ ืฆื• ืึท ื•ื™ืกื ืขื. ื“ืขื ื’ืขืฉืขืขื ื™ืฉ ืื•ื™ืš ื™ืžืคึผืœื™ื™ื– ื“ื™ ืงืึทืžืคึผืœื™ืฉืึทืŸ ืคื•ืŸ ื“ื™ ืกื™ืงื•ื•ืึทื ืก.
  • ื’ืึทื ืฅ - ืกื™ื’ื ืึทืœ ื•ื•ืขื’ืŸ ื“ื™ ืงืึทืžืคึผืœื™ืฉืึทืŸ ืคื•ืŸ ื“ื™ ืกื™ืงื•ื•ืึทื ืก. ื“ืึธืก ืžื™ื™ื ื˜ ืึทื– ืขืก ื•ื•ืขื˜ ื ื™ื˜ ื–ื™ื™ืŸ ืžืขืจ ื ื™ื™ึทืข ื“ืึทื˜ืŸ.

ืœืึธืžื™ืจ ื–ืขืŸ ื“ื™ ื“ืขืžืึธ:

ืึทืกื™ื ื˜ืฉืจืึธื ืึธื•ืก ืคึผืจืึธื’ืจืึทืžืžื™ื ื’ ืื™ืŸ ื“ื–ืฉืึทื•ื•ืึทืกืงืจื™ืคึผื˜ (ืงืึธืœื‘ืึทืง, ืคึผืจืึธืžื™ืกืข, RxJs)

ืื™ืŸ ื“ื™ ืึธื ื”ื™ื™ื‘, ืžื™ืจ ื•ื•ืขืœืŸ ืคึผืจืึธืฆืขืก ื“ื™ ื•ื•ืึทืœื•ืขืก 1, 2, 3 ืื•ืŸ ื ืึธืš 1 ืจื’ืข. ืžื™ืจ ื•ื•ืขืœืŸ ื‘ืึทืงื•ืžืขืŸ 4 ืื•ืŸ ืขื ื“ื™ืงืŸ ืื•ื ื“ื–ืขืจ ื˜ื™ื™ึทืš.

ื˜ืจืื›ื˜ืŸ ื”ื•ื™ืš

ืื•ืŸ ื“ืขืžืึธืœื˜ ืื™ืš ืื™ื™ื ื’ืขื–ืขืŸ ืึทื– ื“ืขืจืฆื™ื™ืœืŸ ืขืก ืื™ื– ืžืขืจ ื˜ืฉื™ืงืึทื•ื•ืข ื•ื•ื™ ืฉืจื™ื™ื‘ืŸ ื•ื•ืขื’ืŸ ืื™ื. ๐Ÿ˜€

ืึทื‘ืึธื ืขืžืขื ื˜

ื•ื•ืขืŸ ืžื™ืจ ืึทื‘ืึธื ื™ืจืŸ ืฆื• ืึท ื˜ื™ื™ึทืš, ืžื™ืจ ืžืึทื›ืŸ ืึท ื ื™ื™ึทืข ืงืœืึทืก ืึทื‘ืึธื ืขืžืขื ื˜ื•ื•ืึธืก ื’ื™ื˜ ืื•ื ื“ื– ื“ื™ ืคื™ื™ื™ืงื™ื™ื˜ ืฆื• ืึทื ืกืึทื‘ืกืงืจื™ื™ื‘ื– ืžื™ื˜ ื“ืขื ืื•ืคึฟืŸ ืึทื ืกืึทื‘ืกืงืจื™ื™ื‘. ืžื™ืจ ืงืขื ืขืŸ ืื•ื™ืš ื’ืจื•ืคึผืข ืกืึทื‘ืกืงืจื™ืคึผืฉืึทื ื– ื ื™ืฆืŸ ื“ืขื ืื•ืคึฟืŸ ืฆื•ื’ืขื‘ืŸ. ื ื•, ืขืก ืื™ื– ืœืึทื“ื–ืฉื™ืงืึทืœ ืึทื– ืžื™ืจ ืงืขื ืขืŸ ืึทื ื’ืจื•ื•ืคึผ ื“ื™ ืคึฟืขื“ืขื ื ื™ืฆืŸ ืึทืจืึธืคึผื ืขืžืขืŸ. ื“ื™ ืœื™ื™ื’ืŸ ืื•ืŸ ืึทืจืึธืคึผื ืขืžืขืŸ ืžืขื˜ื”ืึธื“ืก ืึธื ื ืขืžืขืŸ ืืŸ ืื ื“ืขืจ ืึทื‘ืึธื ืขืžืขื ื˜ ื•ื•ื™ ืึทืจื™ื™ึทื ืฉืจื™ื™ึทื‘. ืื™ืš ื•ื•ืึธืœื˜ ื•ื•ื™ ืฆื• ื˜ืึธืŸ ืึทื– ื•ื•ืขืŸ ืžื™ืจ ืึทื ืกืึทื‘ืกืงืจื™ื™ื‘, ืžื™ืจ ืึทื ืกืึทื‘ืกืงืจื™ื™ื‘ื™ื ื’ ืคื•ืŸ ืึทืœืข ืงื™ื ื“ ืกืึทื‘ืกืงืจื™ืคึผืฉืึทื ื– ื•ื•ื™ ืื•ื™ื‘ ื–ื™ื™ ื”ืึธื‘ืŸ ื’ืขืจื•ืคืŸ ื“ื™ ืึทื ืกืึทื‘ืกืงืจื™ื™ื‘ื™ื ื’ ืื•ืคึฟืŸ. ื’ื™ื™ ื•ื•ื™ื™ื˜ืขืจ.

ื˜ื™ื™ืคึผืก ืคื•ืŸ ืกื˜ืจื™ืžื–

ื”ื™ื™ืก
ืงืึทืœื˜

ืคึผืจืึธื“ื•ืฆื™ืจืขืจ ืื™ื– ื‘ืืฉืืคืŸ ืึทืจื•ื™ืก ืึธื‘ืกืขืจื•ื•ืึทื‘ืœืข
ืคึผืจืึธื“ื•ืฆื™ืจืขืจ ืื™ื– ื‘ืืฉืืคืŸ ื™ืŸ ื‘ืืžืขืจืงื˜

ื“ืึทื˜ืŸ ื–ืขื ืขืŸ ื˜ืจืึทื ืกืคืขืจื“ ืื™ืŸ ื“ืขืจ ืฆื™ื™ื˜ ื•ื•ืขืŸ ื“ื™ ืึทื‘ื–ืขืจื•ื•ืึทื‘ืึทืœ ืื™ื– ื‘ืืฉืืคืŸ
ื“ืึทื˜ืŸ ื–ืขื ืขืŸ ืฆื•ื’ืขืฉื˜ืขืœื˜ ืื™ืŸ ื“ืขืจ ืฆื™ื™ื˜ ืคื•ืŸ ืึทื‘ืึธื ืขืžืขื ื˜

ื“ืึทืจืคึฟืŸ ื ืึธืš ืœืึธื’ื™ืง ืคึฟืึทืจ ืึทื ืกืึทื‘ืกืงืจื™ื™ื‘ื™ื ื’
ื“ืขืจ ืคึฟืึธื“ืขื ืขื ื“ื™ืงื˜ ื–ื™ืš ืึทืœื™ื™ืŸ

ื ื™ืฆื˜ ืึท ืื™ื™ืŸ-ืฆื•-ืคื™ืœืข ืฉื™ื™ื›ื•ืช
ื ื™ืฆื˜ ืึท ืื™ื™ืŸ-ืฆื•-ืื™ื™ื ืขืจ ืฉื™ื™ื›ื•ืช

ืึทืœืข ืกืึทื‘ืกืงืจื™ืคึผืฉืึทื ื– ื”ืึธื‘ืŸ ื“ื™ ื–ืขืœื‘ืข ื˜ื™ื™ึทื˜ืฉ
ืกืึทื‘ืกืงืจื™ืคึผืฉืึทื ื– ื–ืขื ืขืŸ ืคืจื™ื™ึท

ื“ืึทื˜ืŸ ืงืขื ืขืŸ ื–ื™ื™ืŸ ืคืึทืจืคืึทืœืŸ ืื•ื™ื‘ ืื™ืจ ื˜ืึธืŸ ื ื™ื˜ ื”ืึธื‘ืŸ ืึท ืึทื‘ืึธื ืขืžืขื ื˜
ืจื™ืกื•ื™ื– ืึทืœืข ื˜ื™ื™ึทืš ื•ื•ืึทืœื•ืขืก ืคึฟืึทืจ ืึท ื ื™ื™ึทืข ืึทื‘ืึธื ืขืžืขื ื˜

ืฆื• ื’ืขื‘ืŸ ืึทืŸ ืึทื ืึทืœืึทื“ื–ืฉื™, ืื™ืš ื•ื•ืึธืœื˜ ื˜ืจืึทื›ื˜ืŸ ื•ื•ืขื’ืŸ ืึท ื”ื™ื™ืก ื˜ื™ื™ึทืš ื•ื•ื™ ืึท ืคึฟื™ืœื ืื™ืŸ ืึท ื˜ืขืึทื˜ืขืจ. ืื™ืŸ ื•ื•ืึธืก ืคื•ื ื˜ ืื™ืŸ ืฆื™ื™ื˜ ืื™ืจ ืื ื’ืขืงื•ืžืขืŸ, ืคื•ืŸ ื“ืขื ืžืึธืžืขื ื˜ ืื™ืจ ืื ื’ืขื”ื•ื™ื‘ืŸ ื•ื•ืึทืš. ืื™ืš ื•ื•ืึธืœื˜ ืคืึทืจื’ืœื™ื™ึทื›ืŸ ืึท ืงืึทืœื˜ ืœื•ื™ืคืŸ ืฆื• ืึท ืจื•ืคืŸ ืื™ืŸ ื˜ืขืง. ืฉื˜ื™ืฆืŸ. ื™ืขื“ืขืจ ืงืึทืœืœืขืจ ืœื™ืกืึทื ื– ืฆื• ื“ื™ ื•ื•ื•ื™ืกืžื™ื™ืœ ืจืขืงืึธืจื“ื™ื ื’ ืคื•ืŸ ืึธื ื”ื™ื™ื‘ ืฆื• ืขื ื“ื™ืงืŸ, ืึธื‘ืขืจ ืื™ืจ ืงืขื ืขืŸ ื”ืขื ื’ืขืŸ ื–ื™ืš ืžื™ื˜ ืึทื ืกืึทื‘ืกืงืจื™ื™ื‘ื™ื ื’.

ืื™ืš ื•ื•ื™ืœ ื‘ืืžืขืจืงืŸ ืื– ืขืก ื–ืขื ืขืŸ ืื•ื™ืš ื“ื ืื–ื•ื™ื’ืขืจื•ืคืขื ืข ื•ื•ืืจืขืžืข ืคืœื™ืกืŸ (ื“ื™ ื“ืขืคื™ื ื™ืฆื™ืข ื”ืื‘ ืื™ืš ื’ืขื˜ืจืืคืŸ ื’ืืจ ื–ืขืœื˜ืŸ ืื•ืŸ ื ืืจ ืื™ืŸ ืคืจืขืžื“ืข ืงื”ื™ืœื•ืช) - ื“ืืก ืื™ื– ื ืฉื˜ืจืื ื•ื•ืืก ืคืืจื•ื•ืื ื“ืœื˜ ื–ื™ืš ืคื•ืŸ ื ืงืืœื˜ืŸ ืœื•ื™ืคืŸ ืฆื• ื ื”ื™ื™ืกืขืจ. ื“ื™ ืงืฉื™ื ืขืจื™ื™ื–ืึทื– - ื•ื•ื• ืฆื• ื ื•ืฆืŸ)) ืื™ืš ื•ื•ืขืœ ื’ืขื‘ืŸ ืึท ื‘ื™ื™ึทืฉืคึผื™ืœ ืคื•ืŸ ืคื™ืจ.

ืื™ืš ืึทืจื‘ืขื˜ ืžื™ื˜ ืึทื ื’ื•ืœืึทืจ. ืขืจ ืึทืงื˜ื™ื•ื•ืœื™ ื ื™ืฆื˜ rxjs. ืฆื• ื‘ืึทืงื•ืžืขืŸ ื“ืึทื˜ืŸ ืฆื• ื“ื™ ืกืขืจื•ื•ืขืจ, ืื™ืš ื“ืขืจื•ื•ืึทืจื˜ืŸ ืึท ืงืึทืœื˜ ืคืึธื“ืขื ืื•ืŸ ื ื•ืฆืŸ ื“ืขื ืคืึธื“ืขื ืื™ืŸ ื“ื™ ืžื•ืกื˜ืขืจ ื ื™ืฆืŸ asyncPipe. ืื•ื™ื‘ ืื™ืš ื ื•ืฆืŸ ื“ืขื ืจืขืจ ืขื˜ืœืขื›ืข ืžืึธืœ, ื“ืขืจื™ื‘ืขืจ, ืฆื•ืจื™ืงืงื•ืžืขืŸ ืฆื• ื“ื™ ื“ืขืคึฟื™ื ื™ืฆื™ืข ืคื•ืŸ โ€‹โ€‹ืึท ืงืึทืœื˜ ื˜ื™ื™ึทืš, ื™ืขื“ืขืจ ืจืขืจ ื•ื•ืขื˜ ื‘ืขื˜ืŸ ื“ืึทื˜ืŸ ืคื•ืŸ ื“ื™ ืกืขืจื•ื•ืขืจ, ื•ื•ืึธืก ืื™ื– ืžืึธื“ื ืข ืฆื• ื–ืึธื’ืŸ ื“ืขืจ ืžื™ื ื“ืกื˜ืขืจ. ืื•ืŸ ืื•ื™ื‘ ืื™ืš ืคืืจื•ื•ืื ื“ืœื˜ ื ืงืืœื˜ืŸ ืฉื˜ืจืื ืื™ืŸ ื ื•ื•ืืจืขืžืขืŸ, ื“ืขืžืืœื˜ ื•ื•ืขื˜ ืคืืกื™ืจืŸ ืื™ื™ืŸ ืžืืœ ื“ื™ ื‘ืงืฉื”.

ืื™ืŸ ืึทืœื’ืขืžื™ื™ืŸ, ืฆื• ืคึฟืึทืจืฉื˜ื™ื™ืŸ ื“ื™ ื˜ื™ืคึผ ืคื•ืŸ ืคืœืึธื•ื– ืื™ื– ื’ืึทื ืฅ ืฉื•ื•ืขืจ ืคึฟืึทืจ ื‘ื™ื’ื™ื ืขืจื–, ืึธื‘ืขืจ ื•ื•ื™ื›ื˜ื™ืง.

ืึธืคึผืขืจืึทื˜ืึธืจืก

return this.http.get(`${environment.apiUrl}/${this.apiUrl}/trade_companies`)
    .pipe(
        tap(({ data }: TradeCompanyList) => this.companies$$.next(cloneDeep(data))),
        map(({ data }: TradeCompanyList) => data)
    );

ืึธืคึผืขืจื™ื™ื˜ืขืจื– ืฆื•ืฉื˜ืขืœืŸ ืื•ื ื“ื– ื“ื™ ืคื™ื™ื™ืงื™ื™ื˜ ืฆื• ื™ืงืกืคึผืึทื ื“ ืื•ื ื“ื–ืขืจ ืคื™ื™ื™ืงื™ื™ื˜ ืฆื• ืึทืจื‘ืขื˜ืŸ ืžื™ื˜ ืกื˜ืจื™ืžื–. ื–ื™ื™ ื”ืขืœืคึฟืŸ ืงืึธื ื˜ืจืึธืœื™ืจืŸ ื“ื™ ื’ืขืฉืขืขื ื™ืฉืŸ ื•ื•ืึธืก ืคึผืึทืกื™ืจืŸ ืื™ืŸ ื“ื™ ืึธื‘ืกืขืจื•ื•ืึทื‘ืœืข. ืžื™ืจ ื•ื•ืขืœืŸ ืงื•ืงืŸ ืื™ืŸ ืึท ืคึผืึธืจ ืคื•ืŸ ื“ื™ ืžืขืจืกื˜ ืคืึธืœืงืก ืึธื ืขืก, ืื•ืŸ ืžืขืจ ื“ืขื˜ืึทื™ืœืก ื•ื•ืขื’ืŸ ื“ื™ ืึธืคึผืขืจื™ื™ื˜ืขืจื– ืงืขื ืขืŸ ื–ื™ื™ืŸ ื’ืขืคึฟื•ื ืขืŸ ืžื™ื˜ ื“ื™ ืœื™ื ืงืก ืื™ืŸ ื“ื™ ื ื•ืฆื™ืง ืื™ื ืคึฟืึธืจืžืึทืฆื™ืข.

ืึธืคึผืขืจื™ื™ื˜ืขืจื– - ืคื•ืŸ

ื–ืืœ ืก ืึธื ื”ื™ื™ื‘ืŸ ืžื™ื˜ ื“ื™ ืึทื’ื–ื™ืœื™ืขืจื™ ืึธืคึผืขืจืึทื˜ืึธืจ ืคื•ืŸ. ืขืก ืงืจื™ื™ื™ืฅ ืึท ืึธื‘ืกืขืจื•ื•ืึทื‘ืœืข ื‘ืื–ื™ืจื˜ ืื•ื™ืฃ ืึท ืคึผืฉื•ื˜ ื•ื•ืขืจื˜.

ืึทืกื™ื ื˜ืฉืจืึธื ืึธื•ืก ืคึผืจืึธื’ืจืึทืžืžื™ื ื’ ืื™ืŸ ื“ื–ืฉืึทื•ื•ืึทืกืงืจื™ืคึผื˜ (ืงืึธืœื‘ืึทืง, ืคึผืจืึธืžื™ืกืข, RxJs)

ืึธืคึผืขืจื™ื™ื˜ืขืจื– - ืคื™ืœื˜ืขืจ

ืึทืกื™ื ื˜ืฉืจืึธื ืึธื•ืก ืคึผืจืึธื’ืจืึทืžืžื™ื ื’ ืื™ืŸ ื“ื–ืฉืึทื•ื•ืึทืกืงืจื™ืคึผื˜ (ืงืึธืœื‘ืึทืง, ืคึผืจืึธืžื™ืกืข, RxJs)

ื“ืขืจ ืคื™ืœื˜ืขืจ ืึธืคึผืขืจืึทื˜ืึธืจ, ื•ื•ื™ ื“ืขืจ ื ืึธืžืขืŸ ืกืึทื’ื“ื–ืฉืขืก, ืคื™ืœื˜ืขืจืก ื“ื™ ื˜ื™ื™ึทืš ืกื™ื’ื ืึทืœ. ืื•ื™ื‘ ื“ืขืจ ืึธืคึผืขืจืึทื˜ืึธืจ ืงืขืจื˜ ืืžืช, ืขืก ืกืงื™ืคึผืก ื•ื•ื™ื™ึทื˜ืขืจ.

ืึธืคึผืขืจื™ื™ื˜ืขืจื– - ื ืขืžืขืŸ

ืึทืกื™ื ื˜ืฉืจืึธื ืึธื•ืก ืคึผืจืึธื’ืจืึทืžืžื™ื ื’ ืื™ืŸ ื“ื–ืฉืึทื•ื•ืึทืกืงืจื™ืคึผื˜ (ืงืึธืœื‘ืึทืง, ืคึผืจืึธืžื™ืกืข, RxJs)

ื ืขืžืขืŸ - ื ืขืžื˜ ื“ื™ ื•ื•ืขืจื˜ ืคื•ืŸ ื“ื™ ื ื•ืžืขืจ ืคื•ืŸ ืขืžื™ื˜ื˜ืขืจืก, ื ืึธืš ื•ื•ืึธืก ื“ื™ ืคืึธื“ืขื ืขื ื“ืก.

ืึธืคึผืขืจื™ื™ื˜ืขืจื– - debounceTime

ืึทืกื™ื ื˜ืฉืจืึธื ืึธื•ืก ืคึผืจืึธื’ืจืึทืžืžื™ื ื’ ืื™ืŸ ื“ื–ืฉืึทื•ื•ืึทืกืงืจื™ืคึผื˜ (ืงืึธืœื‘ืึทืง, ืคึผืจืึธืžื™ืกืข, RxJs)

debounceTime - ื“ื™ืกืงืึทืจื“ื™ื– ื™ืžื™ื˜ื™ื“ ื•ื•ืึทืœื•ืขืก ื•ื•ืึธืก ืคืึทืœืŸ ืื™ืŸ ื“ื™ ืกืคึผืขืกื™ืคื™ืขื“ ืฆื™ื™ื˜ ืžืขื”ืึทืœืขืš ืฆื•ื•ื™ืฉืŸ ืึทื•ื˜ืคึผื•ืฅ - ื ืึธืš ื“ื™ ืฆื™ื™ื˜ ืžืขื”ืึทืœืขืš ืื™ื– ื“ื•ืจื›ื’ืขื’ืื ื’ืขืŸ, ืขืžื™ืฅ ื“ื™ ืœืขืฆื˜ืข ื•ื•ืขืจื˜.

const { Observable } = Rx;
const { debounceTime, take } = RxOperators;

Observable.create((observer) => {
  let i = 1;
  observer.next(i++);
  // ะ˜ัะฟัƒัะบะฐะตะผ ะทะฝะฐั‡ะตะฝะธะต ั€ะฐะท ะฒ 1000ะผั
  setInterval(() => {
    observer.next(i++)
  }, 1000);

 // ะ˜ัะฟัƒัะบะฐะตะผ ะทะฝะฐั‡ะตะฝะธะต ั€ะฐะท ะฒ 1500ะผั
  setInterval(() => {
    observer.next(i++)
  }, 1500);
}).pipe(
  debounceTime(700),  // ะžะถะธะดะฐะตะผ 700ะผั ะทะฝะฐั‡ะตะฝะธั ะฟั€ะตะถะดะต ั‡ะตะผ ะพะฑั€ะฐะฑะพั‚ะฐั‚ัŒ
  take(3)
);  

ืึทืกื™ื ื˜ืฉืจืึธื ืึธื•ืก ืคึผืจืึธื’ืจืึทืžืžื™ื ื’ ืื™ืŸ ื“ื–ืฉืึทื•ื•ืึทืกืงืจื™ืคึผื˜ (ืงืึธืœื‘ืึทืง, ืคึผืจืึธืžื™ืกืข, RxJs)

ืึธืคึผืขืจื™ื™ื˜ืขืจื– - ื ืขืžืขืŸ ื•ื•ื™ื™ืœืข

ืึทืกื™ื ื˜ืฉืจืึธื ืึธื•ืก ืคึผืจืึธื’ืจืึทืžืžื™ื ื’ ืื™ืŸ ื“ื–ืฉืึทื•ื•ืึทืกืงืจื™ืคึผื˜ (ืงืึธืœื‘ืึทืง, ืคึผืจืึธืžื™ืกืข, RxJs)

ืขืžื™ืฅ ื•ื•ืึทืœื•ืขืก ื‘ื™ื– TakeWhile ืงืขืจื˜ ืคืึทืœืฉ, ื ืึธืš ื•ื•ืึธืก ืขืก ืึทื ืกืึทื‘ืกืงืจื™ื™ื‘ื– ืคื•ืŸ ื“ื™ ืคืึธื“ืขื.

const { Observable } = Rx;
const { debounceTime, takeWhile } = RxOperators;

Observable.create((observer) => {
  let i = 1;
  observer.next(i++);
  // ะ˜ัะฟัƒัะบะฐะตะผ ะทะฝะฐั‡ะตะฝะธะต ั€ะฐะท ะฒ 1000ะผั
  setInterval(() => {
    observer.next(i++)
  }, 1000);
}).pipe(
  takeWhile( producer =>  producer < 5 )
);  

ืึทืกื™ื ื˜ืฉืจืึธื ืึธื•ืก ืคึผืจืึธื’ืจืึทืžืžื™ื ื’ ืื™ืŸ ื“ื–ืฉืึทื•ื•ืึทืกืงืจื™ืคึผื˜ (ืงืึธืœื‘ืึทืง, ืคึผืจืึธืžื™ืกืข, RxJs)

ืึธืคึผืขืจื™ื™ื˜ืขืจื– - ืคืึทืจื‘ื™ื ื“ืŸ ืœืขืฆื˜ืข

ื“ื™ ืงืึธืžื‘ื™ื ืœืึทืกื˜ ืึธืคึผืขืจืึทื˜ืึธืจ ืื™ื– ืขืคึผืขืก ืขื ืœืขืš ืฆื• ืคึผืจืึธืžื™ืงืข.ืึทืœืœ. ืขืก ืงืึทืžื‘ื™ื™ื ื– ืงื™ื™ืคืœ ืคึฟืขื“ืขื ืื™ืŸ ืื™ื™ืŸ. ื ืึธืš ื™ืขื“ืขืจ ืคืึธื“ืขื ืžืื›ื˜ ืœืคึผื—ื•ืช ืื™ื™ืŸ ื™ืžื™ืฉืึทืŸ, ืžื™ืจ ื‘ืึทืงื•ืžืขืŸ ื“ื™ ืœืขืฆื˜ืข ื•ื•ืึทืœื•ืขืก ืคื•ืŸ ื™ืขื“ืขืจ ืื™ืŸ ื“ื™ ืคืึธืจืขื ืคื•ืŸ ืึท ืžืขื ื’ืข. ื ืึธืš ืงื™ื™ืŸ ื™ืžื™ืฉืึทืŸ ืคื•ืŸ ื“ื™ ืžืขืจื“ื–ืฉื“ ืกื˜ืจื™ืžื–, ืขืก ื•ื•ืขื˜ ื’ืขื‘ืŸ ื ื™ื™ึทืข ื•ื•ืึทืœื•ืขืก.

ืึทืกื™ื ื˜ืฉืจืึธื ืึธื•ืก ืคึผืจืึธื’ืจืึทืžืžื™ื ื’ ืื™ืŸ ื“ื–ืฉืึทื•ื•ืึทืกืงืจื™ืคึผื˜ (ืงืึธืœื‘ืึทืง, ืคึผืจืึธืžื™ืกืข, RxJs)

const { combineLatest, Observable } = Rx;
const { take } = RxOperators;

const observer_1 = Observable.create((observer) => {
  let i = 1;
  // ะ˜ัะฟัƒัะบะฐะตะผ ะทะฝะฐั‡ะตะฝะธะต ั€ะฐะท ะฒ 1000ะผั
  setInterval(() => {
    observer.next('a: ' + i++);
  }, 1000);
});

const observer_2 = Observable.create((observer) => {
  let i = 1;
  // ะ˜ัะฟัƒัะบะฐะตะผ ะทะฝะฐั‡ะตะฝะธะต ั€ะฐะท ะฒ 750ะผั
  setInterval(() => {
    observer.next('b: ' + i++);
  }, 750);
});

combineLatest(observer_1, observer_2).pipe(take(5));

ืึทืกื™ื ื˜ืฉืจืึธื ืึธื•ืก ืคึผืจืึธื’ืจืึทืžืžื™ื ื’ ืื™ืŸ ื“ื–ืฉืึทื•ื•ืึทืกืงืจื™ืคึผื˜ (ืงืึธืœื‘ืึทืง, ืคึผืจืึธืžื™ืกืข, RxJs)

ืึธืคึผืขืจื™ื™ื˜ืขืจื– - ืคืึทืจืฉืœืขืกืœืขืŸ

ื–ื™ืคึผ - ื•ื•ื™ื™ืฅ ืคึฟืึทืจ ืึท ื•ื•ืขืจื˜ ืคื•ืŸ ื™ืขื“ืขืจ ืคืึธื“ืขื ืื•ืŸ ืคืืจืžืขืŸ ืึท ืžืขื ื’ืข ื‘ืื–ื™ืจื˜ ืื•ื™ืฃ ื“ื™ ื•ื•ืึทืœื•ืขืก. ืื•ื™ื‘ ื“ื™ ื•ื•ืขืจื˜ ืงื•ืžื˜ ื ื™ืฉื˜ ืคื•ืŸ ืงื™ื™ืŸ ืคืึธื“ืขื, ื“ื™ ื’ืจื•ืคึผืข ื•ื•ืขื˜ ื ื™ืฉื˜ ื–ื™ื™ืŸ ื’ืขืฉืืคืŸ.

ืึทืกื™ื ื˜ืฉืจืึธื ืึธื•ืก ืคึผืจืึธื’ืจืึทืžืžื™ื ื’ ืื™ืŸ ื“ื–ืฉืึทื•ื•ืึทืกืงืจื™ืคึผื˜ (ืงืึธืœื‘ืึทืง, ืคึผืจืึธืžื™ืกืข, RxJs)

const { zip, Observable } = Rx;
const { take } = RxOperators;

const observer_1 = Observable.create((observer) => {
  let i = 1;
  // ะ˜ัะฟัƒัะบะฐะตะผ ะทะฝะฐั‡ะตะฝะธะต ั€ะฐะท ะฒ 1000ะผั
  setInterval(() => {
    observer.next('a: ' + i++);
  }, 1000);
});

const observer_2 = Observable.create((observer) => {
  let i = 1;
  // ะ˜ัะฟัƒัะบะฐะตะผ ะทะฝะฐั‡ะตะฝะธะต ั€ะฐะท ะฒ 750
  setInterval(() => {
    observer.next('b: ' + i++);
  }, 750);
});

const observer_3 = Observable.create((observer) => {
  let i = 1;
  // ะ˜ัะฟัƒัะบะฐะตะผ ะทะฝะฐั‡ะตะฝะธะต ั€ะฐะท ะฒ 500
  setInterval(() => {
    observer.next('c: ' + i++);
  }, 500);
});

zip(observer_1, observer_2, observer_3).pipe(take(5));

ืึทืกื™ื ื˜ืฉืจืึธื ืึธื•ืก ืคึผืจืึธื’ืจืึทืžืžื™ื ื’ ืื™ืŸ ื“ื–ืฉืึทื•ื•ืึทืกืงืจื™ืคึผื˜ (ืงืึธืœื‘ืึทืง, ืคึผืจืึธืžื™ืกืข, RxJs)

ืึธืคึผืขืจื™ื™ื˜ืขืจื– - ืคืึธืจืงื“ื–ืฉืึธื™ืŸ

forkJoin ืื•ื™ืš ื“ื–ืฉื•ื™ื ืฅ ืคึฟืขื“ืขื, ืึธื‘ืขืจ ืขืก ืขืžื™ืฅ ื‘ืœื•ื™ื– ืึท ื•ื•ืขืจื˜ ื•ื•ืขืŸ ืึทืœืข ืคึฟืขื“ืขื ื–ืขื ืขืŸ ื’ืึทื ืฅ.

ืึทืกื™ื ื˜ืฉืจืึธื ืึธื•ืก ืคึผืจืึธื’ืจืึทืžืžื™ื ื’ ืื™ืŸ ื“ื–ืฉืึทื•ื•ืึทืกืงืจื™ืคึผื˜ (ืงืึธืœื‘ืึทืง, ืคึผืจืึธืžื™ืกืข, RxJs)

const { forkJoin, Observable } = Rx;
const { take } = RxOperators;

const observer_1 = Observable.create((observer) => {
  let i = 1;
  // ะ˜ัะฟัƒัะบะฐะตะผ ะทะฝะฐั‡ะตะฝะธะต ั€ะฐะท ะฒ 1000ะผั
  setInterval(() => {
    observer.next('a: ' + i++);
  }, 1000);
}).pipe(take(3));

const observer_2 = Observable.create((observer) => {
  let i = 1;
  // ะ˜ัะฟัƒัะบะฐะตะผ ะทะฝะฐั‡ะตะฝะธะต ั€ะฐะท ะฒ 750
  setInterval(() => {
    observer.next('b: ' + i++);
  }, 750);
}).pipe(take(5));

const observer_3 = Observable.create((observer) => {
  let i = 1;
  // ะ˜ัะฟัƒัะบะฐะตะผ ะทะฝะฐั‡ะตะฝะธะต ั€ะฐะท ะฒ 500
  setInterval(() => {
    observer.next('c: ' + i++);
  }, 500);
}).pipe(take(4));

forkJoin(observer_1, observer_2, observer_3);

ืึทืกื™ื ื˜ืฉืจืึธื ืึธื•ืก ืคึผืจืึธื’ืจืึทืžืžื™ื ื’ ืื™ืŸ ื“ื–ืฉืึทื•ื•ืึทืกืงืจื™ืคึผื˜ (ืงืึธืœื‘ืึทืง, ืคึผืจืึธืžื™ืกืข, RxJs)

ืึธืคึผืขืจื™ื™ื˜ืขืจื– - ืžืึทืคึผืข

ื“ื™ ืžืึทืคึผืข ื˜ืจืึทื ืกืคืึธืจืžืึทืฆื™ืข ืึธืคึผืขืจืึทื˜ืึธืจ ืคืืจื•ื•ืื ื“ืœืขืŸ ื“ื™ ื™ืžื™ื˜ืขืจ ื•ื•ืขืจื˜ ืื™ืŸ ืึท ื ื™ื™ึทืข.

ืึทืกื™ื ื˜ืฉืจืึธื ืึธื•ืก ืคึผืจืึธื’ืจืึทืžืžื™ื ื’ ืื™ืŸ ื“ื–ืฉืึทื•ื•ืึทืกืงืจื™ืคึผื˜ (ืงืึธืœื‘ืึทืง, ืคึผืจืึธืžื™ืกืข, RxJs)

const {  Observable } = Rx;
const { take, map } = RxOperators;

Observable.create((observer) => {
  let i = 1;
  // ะ˜ัะฟัƒัะบะฐะตะผ ะทะฝะฐั‡ะตะฝะธะต ั€ะฐะท ะฒ 1000ะผั
  setInterval(() => {
    observer.next(i++);
  }, 1000);
}).pipe(
  map(x => x * 10),
  take(3)
);

ืึทืกื™ื ื˜ืฉืจืึธื ืึธื•ืก ืคึผืจืึธื’ืจืึทืžืžื™ื ื’ ืื™ืŸ ื“ื–ืฉืึทื•ื•ืึทืกืงืจื™ืคึผื˜ (ืงืึธืœื‘ืึทืง, ืคึผืจืึธืžื™ืกืข, RxJs)

ืึธืคึผืขืจื™ื™ื˜ืขืจื– - ื™ื™ึทื ื˜ื™ื™ืœืŸ, ืฆืึทืคึผืŸ

ื“ืขืจ ืฆืึทืคึผืŸ ืึธืคึผืขืจืึทื˜ืึธืจ ืึทืœืึทื•ื– ืื™ืจ ืฆื• ื˜ืึธืŸ ื–ื™ื™ึทื˜ ื™ืคืขืงืฅ, ื“ืึธืก ืื™ื– ืงื™ื™ืŸ ืึทืงืฉืึทื ื– ื•ื•ืึธืก ื˜ืึธืŸ ื ื™ื˜ ื•ื•ื™ืจืงืŸ ื“ื™ ืกื™ืงื•ื•ืึทื ืก.

ื“ืขืจ ืึธืคึผืขืจืึทื˜ืึธืจ ืคื•ืŸ ื™ื™ึทื ื˜ื™ื™ืœืŸ ื ื•ืฆืŸ ืงืขื ืขืŸ ืžืึทื›ืŸ ืึท ืงืึทืœื˜ ื˜ื™ื™ึทืš ืื™ืŸ ืึท ื”ื™ื™ืก.

ืึทืกื™ื ื˜ืฉืจืึธื ืึธื•ืก ืคึผืจืึธื’ืจืึทืžืžื™ื ื’ ืื™ืŸ ื“ื–ืฉืึทื•ื•ืึทืกืงืจื™ืคึผื˜ (ืงืึธืœื‘ืึทืง, ืคึผืจืึธืžื™ืกืข, RxJs)

ืžื™ืจ ื–ืขื ืขืŸ ืคึฟืึทืจื˜ื™ืง ืžื™ื˜ ื“ื™ ืึธืคึผืขืจื™ื™ื˜ืขืจื–. ืœืึธืžื™ืจ ื’ื™ื™ืŸ ืฆื• ื“ื™ ื˜ืขืžืข.

ื˜ืจืื›ื˜ืŸ ื”ื•ื™ืš

ืื•ืŸ ื“ืขืžืึธืœื˜ ืื™ืš ื’ืขื’ืื ื’ืขืŸ ืฆื• ื˜ืจื™ื ืงืขืŸ ื˜ื™ื™. ืื™ืš ื‘ื™ืŸ ืžื™ื“ ืคื•ืŸ ื“ื™ ื‘ื™ื™ืฉืคื™ืœืŸ ๐Ÿ˜€

ืขื ื™ืŸ ืžืฉืคึผื—ื”

ื“ื™ ื˜ืขืžืข ืžืฉืคึผื—ื” ืื™ื– ืึท ื”ื•ื™ืคึผื˜ ื‘ื™ื™ึทืฉืคึผื™ืœ ืคื•ืŸ ื”ื™ื™ืก ืคืœืึธื•ื–. ื“ื™ ืงืœืืกืŸ ื–ืขื ืขืŸ ืึท ืžื™ืŸ ืคื•ืŸ ื›ื™ื™ื‘ืจื™ื“ ื•ื•ืึธืก ืึทืงื˜ ืกื™ื™ืžืึทืœื˜ื™ื™ื ื™ืึทืกืœื™ ื•ื•ื™ ืึทื‘ื–ืขืจื•ื•ืึทื‘ืึทืœ ืื•ืŸ ืึทื‘ื–ืขืจื•ื•ืขืจ. ื–ื™ื ื˜ ื“ื™ ื˜ืขืžืข ืื™ื– ืึท ื”ื™ื™ืก ืคืึธื“ืขื, ืขืก ืื™ื– ื ื™ื™ื˜ื™ืง ืฆื• ืึทื‘ืึธื ื™ืจืŸ ื“ืขืจืคื•ืŸ. ืื•ื™ื‘ ืžื™ืจ ืจืขื“ืŸ ื•ื•ืขื’ืŸ ื“ื™ ื”ื•ื™ืคึผื˜ ืžืขื˜ื”ืึธื“ืก, ื“ืึธืก ื–ืขื ืขืŸ:

  • ื•ื•ื™ื™ึทื˜ืขืจ - ืึทืจื™ื‘ืขืจืคื™ืจืŸ ืคื•ืŸ ื ื™ื™ึทืข ื“ืึทื˜ืŸ ืฆื• ื“ื™ ื˜ื™ื™ึทืš
  • ื˜ืขื•ืช - ื˜ืขื•ืช ืื•ืŸ ืคืึธื“ืขื ื˜ืขืจืžืึทื ื™ื™ืฉืึทืŸ
  • ื’ืึทื ืฅ - ืงืึทืžืคึผืœื™ืฉืึทืŸ ืคื•ืŸ ื“ื™ ืคืึธื“ืขื
  • ืึทื‘ืึธื ื™ืจืŸ - ืึทื‘ืึธื ื™ืจืŸ ืฆื• ืึท ื˜ื™ื™ึทืš
  • ืึทื ืกืึทื‘ืกืงืจื™ื™ื‘ - ืึทื ืกืึทื‘ืกืงืจื™ื™ื‘ ืคื•ืŸ ื“ื™ ื˜ื™ื™ึทืš
  • asObservable - ื™ื‘ืขืจืžืึทื›ืŸ ืื™ืŸ ืึท ืึทื‘ื–ืขืจื•ื•ืขืจ
  • toPromise - ืคืืจื•ื•ืื ื“ืœืขืŸ ืื™ืŸ ืึท ืฆื•ื–ืึธื’

ืขืก ื–ืขื ืขืŸ 4 5 ื˜ื™ื™ืคึผืก ืคื•ืŸ ืกืึทื‘ื“ื–ืฉืขืงืฅ.

ื˜ืจืื›ื˜ืŸ ื”ื•ื™ืš

ืขืก ื–ืขื ืขืŸ ื’ืขื•ื•ืขืŸ 4 ืžืขื ื˜ืฉืŸ ื’ืขืจืขื“ื˜ ืื•ื™ืฃ ื“ื™ ื˜ื™ื™ึทืš, ืึธื‘ืขืจ ืขืก ื”ืื˜ ื–ื™ืš ื–ื™ื™ ืฆื•ื’ืขื’ืขื‘ืŸ ืื™ื™ื ืขืจ ื ืึธืš. ื•ื•ื™ ื–ื™ื™ ื–ืึธื’ืŸ, ืœืขื‘ืŸ ืื•ืŸ ืœืขืจื ืขืŸ.

ืคึผืฉื•ื˜ ื˜ืขืžืข new Subject()- ื“ื™ ืกื™ืžืคึผืœืึทืกื˜ ื˜ื™ืคึผ ืคื•ืŸ ืกืึทื‘ื“ื–ืฉืขืงืฅ. ื‘ืืฉืืคืŸ ืึธืŸ ืคึผืึทืจืึทืžืขื˜ืขืจืก. ื˜ืจืึทื ืกืžื™ืฅ ื•ื•ืึทืœื•ืขืก ื‘ืืงื•ืžืขืŸ ื‘ืœื•ื™ื– ื ืึธืš ืึทื‘ืึธื ืขืžืขื ื˜.

BehaviorSubject new BehaviorSubject( defaultData<T> ) - ืื™ืŸ ืžื™ื™ืŸ ืžื™ื™ื ื•ื ื’, ื“ื™ ืžืขืจืกื˜ ืคึผืจืึธืกื˜ ื˜ื™ืคึผ ืคื•ืŸ ื˜ืขืžืข. ื“ืขืจ ืึทืจื™ื™ึทื ืฉืจื™ื™ึทื‘ ื ืขืžื˜ ื“ื™ ืคืขืœื™ืงื™ื™ึทื˜ ื•ื•ืขืจื˜. ืฉื˜ืขื ื“ื™ืง ืกืึทื•ื•ืขืก ื“ื™ ื“ืึทื˜ืŸ ืคื•ืŸ ื“ื™ ืœืขืฆื˜ืข ืึทืจื•ื™ืกื’ืขื‘ืŸ, ื•ื•ืึธืก ืื™ื– ื˜ืจืึทื ืกืžื™ื˜ื˜ืขื“ ื•ื•ืขืŸ ืึทื‘ืึธื ื™ืจืŸ. ื“ืขืจ ืงืœืึทืก ืื•ื™ืš ื”ืื˜ ืึท ื ื•ืฆื™ืง ื•ื•ืขืจื˜ ืื•ืคึฟืŸ, ื•ื•ืึธืก ืงืขืจื˜ ื“ื™ ืงืจืึทื ื˜ ื•ื•ืขืจื˜ ืคื•ืŸ ื“ืขื ื˜ื™ื™ึทืš.

ReplaySubject new ReplaySubject(bufferSize?: number, windowTime?: number) - ื“ืขืจ ืึทืจื™ื™ึทื ืฉืจื™ื™ึทื‘ ืงืขื ืขืŸ ืึธืคึผื˜ื™ืึธื ืึทืœืœื™ ื ืขืžืขืŸ ื•ื•ื™ ื“ืขืจ ืขืจืฉื˜ืขืจ ืึทืจื’ื•ืžืขื ื˜ ื“ื™ ื’ืจื™ื™ืก ืคื•ืŸ ื“ื™ ื‘ืึทืคืขืจ ืคื•ืŸ ื•ื•ืึทืœื•ืขืก ื•ื•ืึธืก ืขืก ื•ื•ืขื˜ ืงืจืึธื ืื™ืŸ ื–ื™ืš, ืื•ืŸ ื•ื•ื™ ื“ื™ ืจื’ืข ื“ื™ ืฆื™ื™ื˜ ืื™ืŸ ื•ื•ืึธืก ืžื™ืจ ื“ืึทืจืคึฟืŸ ืขื ื“ืขืจื•ื ื’ืขืŸ.

AsyncSubject new AsyncSubject() - ื’ืึธืจื ื™ืฉื˜ ื›ืึทืคึผืึทื ื– ื•ื•ืขืŸ ืึทื‘ืึธื ื™ืจืŸ, ืื•ืŸ ื“ื™ ื•ื•ืขืจื˜ ื•ื•ืขื˜ ื–ื™ื™ืŸ ืื•ืžื’ืขืงืขืจื˜ ื‘ืœื•ื™ื– ื•ื•ืขืŸ ื’ืึทื ืฅ. ื‘ืœื•ื™ื– ื“ื™ ืœืขืฆื˜ืข ื•ื•ืขืจื˜ ืคื•ืŸ ื“ื™ ื˜ื™ื™ึทืš ื•ื•ืขื˜ ื–ื™ื™ืŸ ืื•ืžื’ืขืงืขืจื˜.

WebSocketSubject new WebSocketSubject(urlConfigOrSource: string | WebSocketSubjectConfig<T> | Observable<T>, destination?: Observer<T>) โ€” ื“ื™ ื“ืืงื•ืžืขื ื˜ืืฆื™ืข ืฉืฐืฒื’ื˜ ืฐืขื’ืŸ ืื™ื ืื•ืŸ ืื™ืš ื–ืข ืื™ื ืฆื•ื ืขืจืฉื˜ืŸ ืžืืœ. ืื•ื™ื‘ ืื™ื™ื ืขืจ ื•ื•ื™ื™ืกื˜ ื•ื•ืืก ืขืจ ื˜ื•ื˜, ื‘ื™ื˜ืข ืฉืจื™ื™ื‘ ืื•ืŸ ืžื™ืจ ื•ื•ืขืœืŸ ืขืก ืฆื•ื’ืขื‘ืŸ.

ืคื™ื™. ื ื•, ืžื™ืจ ื”ืึธื‘ืŸ ื‘ืื“ืขืงื˜ ืึทืœืฅ ืื™ืš ื’ืขื•ื•ืืœื˜ ืฆื• ื–ืึธื’ืŸ ืื™ืจ ื”ื™ื™ึทื ื˜. ืื™ืš ื”ืึธืคึฟืŸ ืึทื– ื“ื™ ืื™ื ืคึฟืึธืจืžืึทืฆื™ืข ืื™ื– ื’ืขื•ื•ืขืŸ ื ื•ืฆื™ืง. ืื™ืจ ืงืขื ืขืŸ ืœื™ื™ืขื ืขืŸ ื“ื™ ืจืฉื™ืžื” ืคื•ืŸ ื‘ืึทื•ื•ื™ื™ึทื–ืŸ ื–ื™ืš ืื™ืŸ ื“ื™ ื ื•ืฆื™ืง ืื™ื ืคึฟืึธืจืžืึทืฆื™ืข ืงื•ื•ื™ื˜ืœ.

ื ื•ืฆื™ืง ืื™ื ืคึฟืึธืจืžืึทืฆื™ืข

ืžืงื•ืจ: www.habr.com

ืœื™ื™ื’ืŸ ืึท ื‘ืึทืžืขืจืงื•ื ื’