เบชเบฐเบเบฒเบเบเบตเบเบธเบเบเบปเบ. Sergey Omelnitsky เบเปเบฒเบฅเบฑเบเบเบดเบเบเปเป. เบเปเปเบเบปเบเบกเบฒเบเบตเป, เบเปเบฒเบเบฐเปเบเบปเปเบฒเปเบเปเปเบเบฑเบเปเบเบปเปเบฒเบเบฒเบเบเบฒเบเบเปเบฒเบเบเบญเบเบเปเบฝเบงเบเบฑเบเบเบฒเบเบเบฝเบเปเบเบฅเปเบเบฅเบก reactive, เบเปเบญเบเบเบตเปเบเปเบฒเบเบฐเปเบเบปเปเบฒเปเบเปเปเบงเบปเปเบฒเบเปเบฝเบงเบเบฑเบ asynchrony เปเบ JavaScript. เบกเบทเปเบเบตเปเบเปเบฒเบเบฐเปเบเบปเปเบฒเบเปเปเบญเบปเบฒเบเบฑเบเบเบถเบเบเปเบฝเบงเบเบฑเบเปเบญเบเบฐเบชเบฒเบเบเบตเป.
เปเบเปเบเปเบญเบเบเบตเปเบเบงเบเปเบฎเบปเบฒเบเบฐเปเบฅเบตเปเบกเบเบปเปเบเบญเบธเบเบฐเบเบญเบเบเบปเปเบเบเป, เบเบงเบเปเบฎเบปเบฒเบเปเบฒเปเบเบฑเบเบเปเบญเบเปเบฎเบฑเบเบเบปเบเปเบเบฐเบเปเบฒ. เบชเบฐเบเบฑเปเบเปเบซเปเปเบฅเบตเปเบกเบเบปเปเบเบเปเบงเบเบเปเบฒเบเบดเบเบฒเบก: stack เปเบฅเบฐเปเบเบงเปเบกเปเบเบซเบเบฑเบ?
stack เปเบเบฑเบเบเบฒเบเปเบเบฑเบเบเบณเบเบตเปเบญเบปเบเบเบฐเบเบญเบเปเบกเปเบเปเบเปเบกเบฒเบเบปเบเบเบทเปเบเบเบฒเบ LIFO เบชเบธเบเบเปเบฒเบ, เบญเบญเบเบเบฑเปเบเบเบณเบญเบดเบ
เบเบดเบง เปเบกเปเบเบเบฒเบเปเบเบฑเบเบเปเบฒเบเบตเปเบญเบปเบเบเบฐเบเบญเบเปเบกเปเบเปเบเปเบฎเบฑเบเปเบเบเบเบทเปเบเบเบฒเบ FIFO เบเปเบฒเบญเบดเบเปเบเบปเปเบฒ, เบญเบญเบเบเปเบฒเบญเบดเบ
เบเบปเบเบฅเบปเบ, เปเบซเปเบชเบทเบเบเปเป.
JavaScript เปเบกเปเบเบเบฒเบชเบฒเบเบฒเบเบเบฝเบเปเบเบผเปเบเบผเบกเบเบตเปเบกเบตเบเบฐเบเบนเปเบเบฝเบง. เบเบตเปเบซเบกเบฒเบเบเบงเบฒเบกเบงเปเบฒเบกเบตเบเบฝเบเปเบเปเบซเบเบถเปเบเบเบฐเบเบนเปเบเบญเบเบเบฒเบเบเบฐเบเบดเบเบฑเบเปเบฅเบฐเบซเบเบถเปเบ stack เบเปเบฝเบงเบเบฑเบเบซเบเปเบฒเบเบตเปเบเบทเบเบเบฑเบเบเบดเบงเบชเปเบฒเบฅเบฑเบเบเบฒเบเบเบฐเบเบดเบเบฑเบ. เบเบฑเปเบเบเบฑเปเบ, JavaScript เบชเบฒเบกเบฒเบเบเบฐเบเบดเบเบฑเบเบซเบเบถเปเบเบเบฑเปเบเบเปเปเบเบฑเปเบ, เปเบเบเบฐเบเบฐเบเบตเปเบเบฒเบเบเปเบฒเปเบเบตเบเบเบฒเบเบญเบทเปเบเปเบเบฐเบฅเปเบเปเบฒเบเบฒเบเปเบเบตเบ stack เบเบญเบเบเบงเบเปเบเบปเบฒเบเบปเบเบเปเบงเบฒเบเบงเบเปเบเบปเบฒเบเบทเบเปเบญเบตเปเบ.
เปเบเบซเบฒ stack เปเบกเปเบเปเบเบเบชเปเบฒเบเบเปเปเบกเบนเบเบเบตเป, เปเบงเบปเปเบฒเบเปเบฒเบเป, เบเบฑเบเบเบถเบเบเปเปเบกเบนเบเบเปเบฝเบงเบเบฑเบเบชเบฐเบเบฒเบเบเบตเปเปเบเปเบเบเบเบฒเบเบเบตเปเบเบงเบเปเบฎเบปเบฒเบขเบนเป. เบเปเบฒเบเบงเบเปเบฎเบปเบฒเบเปเบฒเบเปเบเบปเปเบฒเปเบเปเบเบซเบเปเบฒเบเบตเป, เบเบงเบเปเบฎเบปเบฒเบเบนเปเบเบฒเบเปเบเบปเปเบฒเบเบญเบเบกเบฑเบเปเบเบซเบฒเปเบเบดเบเบชเบธเบเบเบญเบ stack. เปเบกเบทเปเบญเบเบงเบเปเบฎเบปเบฒเบเบฑเบเบเบทเบเบเบฒเบเบเบฑเบเบเบฑเบ, เบเบงเบเปเบฎเบปเบฒเปเบญเบปเบฒเบญเบปเบเบเบฐเบเบญเบเปเบเบดเบเบชเบธเบเบเบฒเบ stack เปเบฅเบฐเบชเบดเปเบเบชเบธเบเบเบฑเบเบเบทเบเปเบเบเปเบญเบเบเบตเปเบเบงเบเปเบฎเบปเบฒเปเบญเบตเปเบเบงเปเบฒเบเบฑเบเบเบฑเบ. เบเบตเปเปเบกเปเบเบเบฑเบเบซเบกเบปเบเบเบตเป stack เบชเบฒเบกเบฒเบเปเบฎเบฑเบเปเบเป. เปเบฅเบฐเปเบเบเบฑเบเบเบธเบเบฑเบเปเบเบฑเบเบเปเบฒเบเบฒเบกเบเบตเปเบซเบเปเบฒเบชเบปเบเปเบเบเบตเปเบชเบธเบ. เปเบฅเปเบง asynchrony เปเบฎเบฑเบเบงเบฝเบเปเบเบงเปเบเปเบ JavasScript?
เปเบเบเบงเบฒเบกเปเบเบฑเบเบเบดเบ, เบเบญเบเปเบซเบเบทเบญเปเบเบเบฒเบ stack, เบเบปเบงเบเปเบญเบเปเบงเบฑเบเบกเบตเปเบเบงเบเบดเปเบชเบเบชเปเบฒเบฅเบฑเบเบเบฒเบเปเบฎเบฑเบเบงเบฝเบเบเบฑเบเบญเบฑเบเบเบตเปเปเบญเบตเปเบเบงเปเบฒ WebAPI. เบเบฑเบเบเบฑเบเปเบเปเบเบงเบเบตเปเบเบฐเบเบทเบเบเบฐเบเบดเบเบฑเบเบเบฒเบกเบฅเปเบฒเบเบฑเบเบเบฝเบเปเบเปเบซเบผเบฑเบเบเบฒเบ stack เปเบเปเบเบทเบเบฅเบถเบเบฅเปเบฒเบเบซเบกเบปเบ. เบเบฝเบเปเบเปเบซเบผเบฑเบเบเบฒเบเบเบฑเปเบเบเบงเบเปเบเบปเบฒเปเบเบปเปเบฒเปเบเปเบเบทเบ pushed เบเบฒเบเปเบเบงเปเบชเป stack เบชเปเบฒเบฅเบฑเบเบเบฒเบเบเบฐเบเบดเบเบฑเบ. เบเปเบฒเบกเบตเบขเปเบฒเบเบซเบเปเบญเบเบซเบเบถเปเบเบญเบปเบเบเบฐเบเบญเบเบขเบนเปเปเบ stack เปเบเปเบงเบฅเบฒเบเบตเป, เบซเบผเบฑเบเบเบฒเบเบเบฑเปเบเบเบงเบเบกเบฑเบเบเปเปเบชเบฒเบกเบฒเบเบเบทเบเปเบเบตเปเบกเปเบชเป stack เปเบเป. เบกเบฑเบเปเบเบฑเบเบเบตเปเบเบฑเบเปเบเบเปเบเบฒเบฐเบงเปเบฒเบเบตเปเบซเบเปเบฒเบเบตเปเปเบเบซเบฒเปเบงเบฅเบฒเบซเบกเบปเบเปเบงเบฅเบฒเบกเบฑเบเบเบฐเบเปเปเบเบฑเบเปเบเบเปเบเปเบงเบฅเบฒ, เปเบเบฒเบฐเบงเปเบฒเบเบฑเบเบเบฑเบเบเปเปเบชเบฒเบกเบฒเบเปเบเปเบฎเบฑเบเบเบฒเบเปเบเบงเปเบเบซเบฒ stack เปเบเบเบฐเบเบฐเบเบตเปเบกเบฑเบเปเบเบฑเบก.
เปเบซเปเปเบเบดเปเบเบเบปเบงเบขเปเบฒเบเบเปเปเปเบเบเบตเปเปเบฅเบฐเปเบฅเบตเปเบกเบเบปเปเบเบเปเบงเบเบเบฒเบเบเบฐเบเบดเบเบฑเบเบเบฑเปเบเบเบญเบเปเบเบเบเบฑเปเบเบเบญเบเบเบญเบเบกเบฑเบ. เปเบซเปเปเบฎเบปเบฒเปเบเบดเปเบเบชเบดเปเบเบเบตเปเปเบเบตเบเบเบถเปเบเปเบเบฅเบฐเบเบปเบ.
console.log('Hi');
setTimeout(function cb1() {
console.log('cb1');
}, 5000);
console.log('Bye');
1) เบเปเปเบกเบตเบซเบเบฑเบเปเบเบตเบเบเบถเปเบเปเบเบทเปเบญ. เบเบญเบเปเบเบเบญเบเบเบปเบงเบเปเบญเบเปเบงเบฑเบเปเบกเปเบเบเบฐเปเบเปเบ, stack เบเบฒเบเปเบเปเบกเปเบเบซเบงเปเบฒเบเปเบเบปเปเบฒ.
2) เบซเบผเบฑเบเบเบฒเบเบเบฑเปเบ, เบเปเบฒเบชเบฑเปเบ console.log('Hi') เปเบเปเบเบทเบเปเบเบตเปเบกเปเบเบปเปเบฒเปเบ stack เบเบฒเบเปเบ.
3) เปเบฅเบฐเบกเบฑเบเปเบเปเบเบทเบเบเบฑเบเบฅเบธเบเบปเบ
4) เบซเบผเบฑเบเบเบฒเบเบเบฑเปเบ, console.log('Hi') เปเบเปเบเบทเบเปเบเบเบเปเบฒเบเบญเบญเบเบเบฒเบ stack เบเบฒเบเปเบ.
5) เบเบญเบเบเบตเปเบเปเบฒเบเปเบเบเบตเปเบเปเบฒเบชเบฑเปเบ setTimeout(function cb1() {โฆ }). เบกเบฑเบเปเบเปเบเบทเบเปเบเบตเปเบกเปเบเบปเปเบฒเปเบ stack เบเบฒเบเปเบ.
6) เบเปเบฒเบชเบฑเปเบ setTimeout(function cb1() {โฆ }) เบเบทเบเบเบฐเบเบดเบเบฑเบ. เบเบปเบงเบเปเบญเบเปเบงเบฑเบเบชเปเบฒเบเปเบเบทเปเบญเบเบเบฑเบเปเบงเบฅเบฒเปเบเบดเปเบเปเบเบฑเบเบชเปเบงเบเบซเบเบถเปเบเบเบญเบ Web API. เบกเบฑเบเบเบฐเบเบฐเบเบดเบเบฑเบเบเบฒเบเบเบฑเบเบเบญเบเบซเบผเบฑเบ.
7) เบเปเบฒเบชเบฑเปเบ setTimeout(function cb1() {... }) เปเบเปเบชเปเบฒเปเบฅเบฑเบเบเบฒเบเปเบฎเบฑเบเบงเบฝเบเบเบญเบเบกเบฑเบเปเบฅเบฐเบเบทเบเปเบเบเบเปเบฒเบเบญเบญเบเบเบฒเบ stack เบเบฒเบเปเบ.
8) เบเปเบฒเบชเบฑเปเบ console.log('Bye') เปเบเปเบเบทเบเปเบเบตเปเบกเปเบเบปเปเบฒเปเบ stack เบเบฒเบเปเบ.
9) เบเปเบฒเบชเบฑเปเบ console.log('Bye') เบเบทเบเบเบฐเบเบดเบเบฑเบ.
10) เบเปเบฒเบชเบฑเปเบ console.log('Bye') เบเบทเบเบฅเบถเบเบญเบญเบเบเบฒเบ stack เบเบฒเบเปเบ.
11) เบซเบผเบฑเบเบเบฒเบเบขเปเบฒเบเปเปเบญเบ 5000 ms เบเปเบฒเบเปเบเปเบฅเปเบง, เปเบเบทเปเบญเบเบเบฑเบเปเบงเบฅเบฒเบเบฐเบขเบธเบเบฅเบปเบ เปเบฅเบฐเบงเบฒเบ callback cb1 เปเบเปเบเบง callback.
12) เปเบซเบเบเบฒเบ loop เปเบเปเบเบฑเบเบเบฑเบ cb1 เบเบฒเบเบเบดเบงเปเบเบเบฑเบเบเบทเบเปเบฅเบฐเบงเบฒเบเบกเบฑเบเปเบงเปเปเบ stack เบเบฒเบเปเบ.
13) เบเบฑเบเบเบฑเบ cb1 เบเบทเบเบเบฐเบเบดเบเบฑเบ เปเบฅเบฐเปเบเบตเปเบก console.log('cb1') เปเบชเปเบเบธเบเบเบฒเบเปเบ.
14) เบเปเบฒเบชเบฑเปเบ console.log('cb1') เบเบทเบเบเบฐเบเบดเบเบฑเบ.
15) เบเปเบฒเบชเบฑเปเบ console.log('cb1') เบเบทเบเปเบเบเบเปเบฒเบเบญเบญเบเบเบฒเบ stack เบเบฒเบเปเบ.
16) เบเบฑเบเบเบฑเบ cb1 เบเบทเบเปเบเบเบเปเบฒเบเบญเบญเบเบเบฒเบ stack เบเบฒเบเปเบ.
เบเปโเปเบซเปโเปเบเบดเปเบโเบเบปเบงโเบขเปเบฒเบโเปเบโเบเบฒเบโเปเบเบทเปเบญเบโเปเบซเบงโ:
เปเบฅเปเบง, เบเบงเบเปเบฎเบปเบฒเปเบเปเปเบเบดเปเบเบงเบดเบเบตเบเบฒเบ asynchrony เบเบทเบเบเบฐเบเบดเบเบฑเบเปเบ JavaScript. เบเบญเบเบเบตเปเปเบซเปเปเบงเบปเปเบฒเบชเบฑเปเบเปเบเปเบฝเบงเบเบฑเบเบงเบดเบงเบฑเบเบเบฐเบเบฒเบเบฒเบเบเบญเบเบฅเบฐเบซเบฑเบ asynchronous.
เบเบฒเบเบเบฑเบเบเบฐเบเบฒเบเบญเบเบฅเบฐเบซเบฑเบ asynchronous.
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);
})
})
})
})
})
});เบเบฒเบเบเบฝเบเปเบเบฅเปเบเบฅเบก Asynchronous เบเบฑเปเบเบเบตเปเบเบงเบเปเบฎเบปเบฒเบฎเบนเปเปเบ JavaScript เบชเบฒเบกเบฒเบเบเบทเบเบเบฐเบเบดเบเบฑเบเปเบเบเบซเบเปเบฒเบเบตเปเปเบเบปเปเบฒเบเบฑเปเบ. เบเบงเบเปเบเบปเบฒเบชเบฒเบกเบฒเบเบเบทเบเบชเบปเปเบเบเปเบฒเบเบเบทเบเบฑเบเบเบปเบงเปเบเบญเบทเปเบเปเบเปเปเบเบฑเบเบซเบเปเบฒเบเบตเปเบญเบทเปเบเป. เบเบตเปเปเบกเปเบเบงเบดเบเบตเบเบตเป callbacks เปเบเบตเบเบกเบฒ. เปเบฅเบฐเบกเบฑเบเปเบขเบฑเบ, เบกเปเบงเบเปเบฅเบฐเบซเบผเบดเปเบ, เบเบปเบเบเปเบงเบฒเบกเบฑเบเบเบฒเบเปเบเบฑเบเบเบงเบฒเบกเปเบชเบเปเบชเบปเปเบฒ, melancholy เปเบฅเบฐเบเบงเบฒเบกเปเบชเบเปเบชเบปเปเบฒ. เปเบเบฑเบเบซเบเบฑเบ? เบกเบฑเบเบเปเบฒเบเบเบฒเบ:
- เปเบเบเบฐเบเบฐเบเบตเปเบเบงเบฒเบกเบเบฑเบเบเปเบญเบเบเบญเบเบฅเบฐเบซเบฑเบเปเบเบตเปเบกเบเบถเปเบ, เปเบเบเบเบฒเบเบเบฑเปเบเบเปเบฒเบงเปเบเปเบเปเบฝเบเปเบเบฑเบเบเบดเบเบเบฑเบ, เบเปเปเบฒเบเปเบญเบ - "callback hell".
- เบเบฒเบเบเบฑเบเบเบฒเบเบเบงเบฒเบกเบเบดเบเบเบฒเบเบชเบฒเบกเบฒเบเบเบฒเบเปเบเปเบเปเบฒเบ.
- เบเปเบฒเบโเบเปเปโเบชเบฒโเบกเบฒเบโเบชเบปเปเบโเบเบทเบโเบเบฒเบโเบชเบฐโเปเบเบโเบญเบญเบโเบเบฑเบโเบเบทเบโ.
เบเปเบงเบเบเบฒเบเบกเบฒเปเบเบดเบเบเบญเบเบเปเบฒเบชเบฑเบเบเบฒ, เบชเบฐเบเบฒเบเบฐเบเบฒเบเปเบเปเบเบตเบเบถเปเบเปเบฅเบฑเบเบเปเบญเบ.
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
- เบเบงเบเปเบฎเบปเบฒเบชเบฒเบกเบฒเบเปเบเปเปเบ asynchrony nested เปเบเบเปเบเป async/await
เปเบเปเบเปเบฒเบซเบกเบฑเปเบเบชเบฑเบเบเบฒเบกเบตเบเปเปเบเปเบฒเบเบฑเบเบเบญเบเบเบงเบเปเบเบปเบฒ. เบเบปเบงเบขเปเบฒเบ, เบเปเบฒเบชเบฑเบเบเบฒเบเปเปเบชเบฒเบกเบฒเบเบเบทเบเบเบปเบเปเบฅเบตเบเปเบเปเปเบเบเบเปเปเบกเบตเบเบฒเบเปเบเบฑเปเบเบฅเปเบฒเบเบฑเบ tambourine, เปเบฅเบฐเบชเบดเปเบเบเบตเปเบชเปเบฒเบเบฑเบเบเบตเปเบชเบธเบเปเบกเปเบเบงเปเบฒเบกเบฑเบเปเบฎเบฑเบเบงเบฝเบเบเบฑเบเบกเบนเบเบเปเบฒเบซเบเบถเปเบ.
เบเบต, เบเบงเบเปเบฎเบปเบฒเปเบเปเปเบเบปเปเบฒเบซเบฒเบเบฒเบเบเบฝเบเปเบเบฅเปเบเบฅเบก reactive เบขเปเบฒเบเบฅเบฝเบเบเปเบฒเบ. เปเบกเบทเปเบญเบ? เบเบต, เปเบเบเบเบต, เบเปเบฒเบเบชเบฒเบกเบฒเบเปเบฎเบฑเบเบเบฒเบเบฒเบ, เบเบดเบเบเปเบฝเบงเบเบฑเบเบกเบฑเบเปเบฅเบฐเบเบฑเบเบกเบฒเบญเปเบฒเบเปเบเบตเปเบกเปเบเบตเบก. เปเบฅเบฐเบเปเบญเบเบเบฐเบชเบทเบเบเปเป.
เปเบเบฃเปเบเบก Reactiveโเปเบเบฑเบเบเบฐเบเบงเบเบงเบดเบงเบฑเบเบเบฒเบเบเบฝเบเปเบเบฅเปเบเบฅเบกเบเบตเปเบชเบธเบกเปเบชเปเบเบฒเบเปเบซเบฅเบเบญเบเบเปเปเบกเบนเบเปเบฅเบฐเบเบฒเบเบเปเบฝเบเปเบเบเบเบฒเบเบเบฐเบซเบเบฒเบเบเบฑเบ. เบฅเบญเบเบเบดเบเบฒเบฅเบฐเบเบฒเปเบเบดเปเบเบงเปเบฒเบเบฐเปเบชเบเปเปเบกเบนเบเปเบกเปเบเบซเบเบฑเบ.
// ะะพะปััะฐะตะผ ัััะปะบั ะฝะฐ ัะปะตะผะตะฝั
const input = ducument.querySelector('input');
const eventsArray = [];
// ะััะธะผ ะบะฐะถะดะพะต ัะพะฑััะธะต ะฒ ะผะฐััะธะฒ eventsArray
input.addEventListener('keyup',
event => eventsArray.push(event)
);เปเบซเปเบเบดเบเบเบฐเบเบฒเบเบฒเบเบงเปเบฒเบเบงเบเปเบฎเบปเบฒเบกเบตเบเปเบญเบเปเบชเปเบเปเปเบกเบนเบ. เบเบงเบเปเบฎเบปเบฒเบชเปเบฒเบ array เปเบฅเบฐเบชเปเบฒเบฅเบฑเบเบเบธเบเป keyup เบเบญเบเปเบซเบเบเบฒเบ input เบเบงเบเปเบฎเบปเบฒเบเบฐเปเบเบฑเบเบฎเบฑเบเบชเบฒเปเบซเบเบเบฒเบเปเบ array เบเบญเบเบเบงเบเปเบฎเบปเบฒ. เปเบเปเบงเบฅเบฒเบเบฝเบงเบเบฑเบ, เบเปเบฒเบเบฐเปเบเบปเปเบฒเบขเบฒเบเบชเบฑเบเปเบเบเบงเปเบฒ array เบเบญเบเบเบงเบเปเบฎเบปเบฒเบเบทเบเบเบฑเบเบฎเบฝเบเบเบฒเบกเปเบงเบฅเบฒ, i.e. เบเบฑเบเบเบฐเบเบตเบเบญเบเปเบซเบเบเบฒเบเบเปเปเบกเบฒเปเบกเปเบเปเบซเบเปเบเบงเปเบฒเบเบฑเบเบเบฐเบเบตเบเบญเบเปเบซเบเบเบฒเบเบเปเบญเบเบซเบเปเบฒ. array เบเบฑเปเบเบเปเบฒเบงเปเบเบฑเบเบเบปเบงเปเบเบเบเบตเปเบเปเบฒเบเบเบญเบเบเบฒเบเปเบซเบฅเบเบญเบเบเปเปเบกเบนเบ, เปเบเปเบกเบฑเบเบเบฑเบเบเปเปเบเบฑเบเปเบเบฑเบเบเบฐเปเบช. เปเบเบทเปเบญเปเบซเป array เบเบตเปเบเบทเบเปเบญเบตเปเบเบงเปเบฒเบเบฒเบเบเปเบฒเบเบเบญเบเบขเปเบฒเบเบเบญเบเปเบ, เบกเบฑเบเบเบฐเบเปเบญเบเบชเบฒเบกเบฒเบเปเบเปเบเปเบซเปเบเบนเปเบเบญเบเปเบเปเบขเปเบฒเบเปเบเบเปเปเบเบฒเบกเบงเปเบฒเบเปเปเบกเบนเบเปเบซเบกเปเบกเบฒเบฎเบญเบเบกเบฑเบ. เบเบฑเปเบเบเบฑเปเบเบเบงเบเปเบฎเบปเบฒเบกเบฒเบฎเบญเบเบเปเบฒเบเบดเบเบฒเบกเบเบญเบเบเบฒเบเปเบซเบผ.
เบเบฐเปเบชเบเปเปเบกเบนเบ
const { interval } = Rx;
const { take } = RxOperators;
interval(1000).pipe(
take(4)
)
เบเบฐเปเบชโเปเบกเปเบ array เบเบญเบเบเปเปเบกเบนเบเบเบฑเบเบฎเบฝเบเบเบฒเบกเปเบงเบฅเบฒเบเบตเปเบชเบฒเบกเบฒเบเบเบตเปเบเบญเบเบงเปเบฒเบเปเปเบกเบนเบเบกเบตเบเบฒเบเบเปเบฝเบเปเบเบ. เบเบญเบเบเบตเปเบเบดเบเบเบฐเบเบฒเบเบฒเบเบงเปเบฒเบกเบฑเบเบชเบฐเบเบงเบเบเบฒเบเปเบเบเบตเปเบเบฐเบเบฝเบเบฅเบฐเบซเบฑเบเบเบตเปเบเบฒเบเบเบฐเบเบดเบเบฑเบเบซเบเบถเปเบเบฎเบฝเบเบฎเปเบญเบเปเบซเปเบกเบตเบเบฒเบเปเบเบซเบฒเบซเบผเบฒเบเปเปเบซเบเบเบฒเบเปเบเบชเปเบงเบเบเปเบฒเบเปเบเบญเบเบฅเบฐเบซเบฑเบ. เบเบงเบเปเบฎเบปเบฒเบเบฝเบเปเบเปเบชเบฐเปเบฑเบเปเบเปเบเบฐเปเบช เปเบฅเบฐเบกเบฑเบเบเบฐเปเบเปเบเปเบเบทเบญเบเบเบงเบเปเบฎเบปเบฒเปเบกเบทเปเบญเบกเบตเบเบฒเบเบเปเบฝเบเปเบเบเปเบเบตเบเบเบถเปเบ. เปเบฅเบฐเบซเปเบญเบเบชเบฐเบซเบกเบธเบ RxJs เบชเบฒเบกเบฒเบเปเบฎเบฑเบเปเบเป.
RxJS เปเบเบฑเบเบซเปเบญเบเบชเบฐเปเบธเบเบชเบณเบฅเบฑเบเบเบฒเบเปเบฎเบฑเบเบงเบฝเบเบเบฑเบเปเบเบฃเปเบเบฃเบกเบเบตเปเบเปเปเบเบดเปเบเปเบเบ เปเบฅเบฐ เปเบซเบเบเบฒเบเบเบตเปเบญเบตเบเปเบชเปเบฅเบณเบเบฑเบเบเบตเปเบชเบฑเบเปเบเบเปเบเป. เบซเปเบญเบเบชเบฐเบซเบกเบธเบเบชเบฐเบซเบเบญเบเบเบฐเปเบเบเบเบทเปเบเบเบฒเบ เบชเบฑเบเปเบเบเปเบเป, เบซเบผเบฒเบโเบเบฐโเปเบเบโเบเบฒเบโเบเปเบงเบโเปเบซเบผเบทเบญ (เบเบนเปเบชเบฑเบเปเบเบเบเบฒเบ, เบเบนเปเบเบฑเบเบเบฒเบเบฐเบฅเบฒเบ, เบงเบดเบเบฒ) เปเบฅเบฐโเบเบนเปโเบเปเบฒโเปเบเบตเบโเบเบฒเบโเบชเปเบฒโเบฅเบฑเบโเบเบฒเบโเปเบฎเบฑเบโเบงเบฝเบโเบฎเปเบงเบกโเบเบฑเบโเปเบซเบโเบเบฒเบโเปเบเบฑเปเบโเบเบฝเบงโเบเบฑเบโเบเบฑเบโเบเบฒเบโเปเบเบฑเบโเบเปเบฒ (เปเบเบเบเบตเป, เบเบฒเบเบเบฑเปเบเบเบญเบ, เบซเบผเบธเบเบเปเบญเบ, เบเบธเบ เปเบฅเบฐเบชเบดเปเบเบเบตเปเบเปเบฒเบเบเบทเบเบฑเบเบเบฒเบ JavaScript Array).
เปเบซเปเบเบงเบเปเบฎเบปเบฒเปเบเบปเปเบฒเปเบเปเบเบงเบเบงเบฒเบกเบเบดเบเบเบทเปเบเบเบฒเบเบเบญเบเบซเปเบญเบเบชเบฐเบซเบกเบธเบเบเบตเป.
เบชเบฑเบเปเบเบเปเบเป, เบเบนเปเบชเบฑเบเปเบเบเบเบฒเบ, เบเบนเปเบเบฐเบฅเบดเบ
Observable เปเบกเปเบเบเบฐเปเบเบเบเบทเปเบเบเบฒเบเบเปเบฒเบญเบดเบเบเบตเปเบเบงเบเปเบฎเบปเบฒเบเบฐเปเบเบดเปเบ. เบซเปเบญเบเบฎเบฝเบเบเบตเปเบกเบตเบชเปเบงเบเบเบปเปเบเบเปเบเบญเบเบเบฒเบเบเบฐเบเบดเบเบฑเบ RxJs. เบกเบฑเบเปเบเบทเปเบญเบกเปเบเบเบเบฑเบเบเบฐเปเบชเบเบตเปเบชเบฒเบกเบฒเบเบชเบฑเบเปเบเบเปเบเป, เปเบเบดเปเบเบชเบฒเบกเบฒเบเบเบญเบเปเบเปเปเบเบเปเบเปเบงเบดเบเบตเบเบฒเบเบเบญเบ.
Observable เบเบฐเบเบดเบเบฑเบเบเบปเบเปเบเบเบนเปเบเปเบงเบเบชเปเบฒเบฅเบฑเบเบเบฒเบเบชเปเบฒเบเบเบฒเบเบเบฑเบเบเบธเบ, เบญเบฑเบเบเบตเปเปเบญเบตเปเบเบงเปเบฒ เบเบนเปเบชเบฑเบเปเบเบเบเบฒเบ. เปเบซเบผเปเบเบเบญเบเบเบธเบเบเปเบฒเบชเปเบฒเบฅเบฑเบเบเบนเปเบชเบฑเบเปเบเบเบเบฒเบเปเบกเปเบเปเบญเบตเปเบเบงเปเบฒ เบเบนเปเบเบฐเบฅเบดเบ. เบเบตเปเบญเบฒเบเบเบฐเปเบเบฑเบ array, iterator, web socket, เบเบฒเบเบเบฐเปเบเบเบเบญเบเปเบซเบเบเบฒเบ, เปเบฅเบฐเบญเบทเปเบเป. เบเบฑเปเบเบเบฑเปเบเบเบงเบเปเบฎเบปเบฒเบชเบฒเบกเบฒเบเปเบงเบปเปเบฒเบงเปเบฒ observable เปเบกเปเบ conductor เบฅเบฐเบซเบงเปเบฒเบเบเบนเปเบเบฐเบฅเบดเบเปเบฅเบฐเบเบนเปเบชเบฑเบเปเบเบเบเบฒเบ.
Observable เบเบฑเบเบเบฒเบเบชเบฒเบกเบเบฐเปเบเบเบเบญเบเปเบซเบเบเบฒเบ Observer:
- เบเปเปเปเบ - เบเปเปเบกเบนเบเปเบซเบกเป
- error โ เบเบงเบฒเบกเบเบดเบเบเบฒเบเบเปเบฒเบซเบฒเบเบงเปเบฒเบฅเปเบฒเบเบฑเบเบชเบดเปเบเบชเบธเบเบฅเบปเบเปเบเบทเปเบญเบเบเบฒเบเบเบฒเบเบเบปเบเปเบงเบฑเปเบ. เปเบซเบเบเบฒเบเบเบตเปเบเบฑเบเบซเบกเบฒเบเปเบเบดเบเบเบฒเบเบชเปเบฒเปเบฅเบฑเบเบเบญเบเบฅเปเบฒเบเบฑเบ.
- เบชเบปเบกเบเบนเบ โ เบชเบฑเบเบเบฒเบเบเปเบฝเบงเบเบฑเบเบเบฒเบเบชเปเบฒเปเบฅเบฑเบเบเบญเบเบฅเปเบฒเบเบฑเบ. เบเบตเปเบซเบกเบฒเบเบเบงเบฒเบกเบงเปเบฒเบเบฐเบเปเปเบกเบตเบเปเปเบกเบนเบเปเบซเบกเปเบญเบตเบ.
เบกเบฒเปเบเบดเปเบเบเบปเบงเบขเปเบฒเบ:
เปเบเบเบญเบเปเบฅเบตเปเบกเบเบปเปเบเบเบงเบเปเบฎเบปเบฒเบเบฐเบเบฐเบกเบงเบเบเบปเบเบเปเบฒ 1, 2, 3, เปเบฅเบฐเบซเบผเบฑเบเบเบฒเบ 1 เบงเบดเบเบฒเบเบต. เบเบงเบเปเบฎเบปเบฒเบเบฐเปเบเปเบฎเบฑเบ 4 เปเบฅเบฐเบชเบดเปเบเบชเบธเบเบเบฒเบเบเปเบฒเบเบเบญเบเบเบญเบเบเบงเบเปเบฎเบปเบฒ.
เบเบดเบเบญเบญเบเบชเบฝเบเบเบฑเบ
เปเบฅเบฐเบซเบผเบฑเบเบเบฒเบเบเบฑเปเบเบเปเบฒเบเบฐเปเบเบปเปเบฒเบฎเบฑเบเบฎเบนเปเบงเปเบฒเบเบฒเบเบเบญเบเบกเบฑเบเบซเบเปเบฒเบชเบปเบเปเบเบซเบผเบฒเบเบเปเบงเบฒเบเบฒเบเบเบฝเบเบเปเบฝเบงเบเบฑเบเบกเบฑเบ. ๐
เบเบฒเบเบชเบฐเบซเบกเบฑเบ
เปเบกเบทเปเบญเบเบงเบเปเบฎเบปเบฒเบเบดเบเบเบฒเบกเบเบฒเบเบเปเบฒเบเบเบญเบเบเบงเบเปเบฎเบปเบฒเบชเปเบฒเบเบเบฑเปเบเบฎเบฝเบเปเบซเบกเป เบเบฒเบเบเบญเบเปเบเบดเปเบเปเบฎเบฑเบเปเบซเปเบเบงเบเปเบฎเบปเบฒเบชเบฒเบกเบฒเบเบเบปเบเปเบฅเบตเบเบเบฒเบเบเบญเบเปเบเบเปเบเปเบงเบดเบเบตเบเบฒเบ unsubscribe. เบเบงเบเปเบฎเบปเบฒเบเบฑเบเบชเบฒเบกเบฒเบเบเบฑเบเบเบธเปเบกเบเบฒเบเบเบญเบเปเบเบเปเบเปเบงเบดเบเบตเบเบฒเบ เปเบเบตเปเบก. เบเบต, เบกเบฑเบเบชเบปเบกเปเบซเบเบชเบปเบกเบเบปเบเบเบตเปเบเบงเบเปเบฎเบปเบฒเบชเบฒเบกเบฒเบเปเบเบเบเบธเปเบกเบซเบปเบงเบเปเปเปเบเบเปเบเป เปเบญเบปเบฒ. เบงเบดเบเบตเบเบฒเบเปเบเบตเปเบก เปเบฅเบฐเบฅเบถเบเปเบญเบปเบฒเบเบฒเบเบชเบฐเปเบฑเบเบชเบฐเบกเบฒเบเบดเบเบญเบทเปเบเปเบเบฑเบเบเบฒเบเบเปเบญเบเบเปเปเบกเบนเบ. เบเปเบฒเบเบฐเปเบเบปเปเบฒเบขเบฒเบเบเบฐเบชเบฑเบเปเบเบเบงเปเบฒเปเบกเบทเปเบญเบเบงเบเปเบฎเบปเบฒเบเบปเบเปเบฅเบตเบเบเบฒเบเบเบญเบ, เบเบงเบเปเบฎเบปเบฒเบเบปเบเปเบฅเบตเบเบเบฒเบเบฅเบปเบเบเบฐเบเบฝเบเปเบเบฑเบเบเปเบญเบเบเบฑเบเบซเบกเบปเบเบเบทเบเบฑเบเบงเปเบฒเบเบงเบเปเบเบปเบฒเปเบญเบตเปเบเบงเปเบฒเบงเบดเบเบตเบเบฒเบเบเบปเบเปเบฅเบตเบเบเบฒเบเบเบญเบ. เบชเบทเบเบเปเปเปเบเบตเบเบซเบเปเบฒ.
เบเบฐเปเบเบเบเบญเบเบชเบฒเบเบเปเปเบฒ
HOT
เบเบฐเบ.เบญเบ
เบเบนเปเบเบฐเบฅเบดเบเบเบทเบเบชเปเบฒเบเบเบทเปเบเบเบฒเบเบเบญเบเบเบตเปเบชเบฑเบเปเบเบเปเบซเบฑเบ
เบเบนเปเบเบฐเบฅเบดเบเบเบทเบเบชเปเบฒเบเบเบทเปเบเบเบฒเบเปเบเบเบตเปเบชเบฑเบเปเบเบเปเบซเบฑเบ
เบเปเปเบกเบนเบเบเบทเบเปเบญเบเปเบเปเบงเบฅเบฒเบเบตเปเบชเบฑเบเปเบเบเปเบเปเบเบทเบเบชเปเบฒเบเบเบถเปเบ
เบเปเปเบกเบนเบเปเบกเปเบเบชเบฐเปเบญเบเปเบซเปเปเบเปเบงเบฅเบฒเบชเบฐเปเบฑเบ
เบเปเบญเบเบเบฒเบเปเบซเบเบเบปเบเปเบเบตเปเบกเปเบเบตเบกเบชเปเบฒเบฅเบฑเบเบเบฒเบเบเบปเบเปเบฅเบตเบเบเบฒเบเบเบญเบ
เบเบฐเบเบนเปเบชเบดเปเบเบชเบธเบเบฅเบปเบเบเปเบงเบเบเบปเบงเบกเบฑเบเปเบญเบ
เปเบเปเบเบงเบฒเบกเบชเบณเบเบฑเบเปเบเบเปเบถเปเบเบเปเปเบซเบผเบฒเบเบญเบฑเบ
เปเบเปเบเบงเบฒเบกเบชเบณเบเบฑเบเปเบเบเปเบถเปเบเบเปเปเปเบถเปเบ
เบเบฒเบเบชเบฐเปเบฑเบเปเบเปเบเบฑเบเปเบปเบเบกเบตเบเบงเบฒเบกเปเบฒเบเบเบทเบเบฑเบ
เบเบฒเบเบชเบฐเปเบฑเบเปเบเปเปเบกเปเบเปเบญเบเบฐเบฅเบฒเบ
เบเปเปโเบกเบนเบโเบชเบฒโเบกเบฒเบโเบชเบนเบโเปเบชเบโเปเบโเบเปเบฒโเบซเบฒเบโเบงเปเบฒโเบเปเบฒเบโเบเปเปโเบกเบตโเบเบฒเบโเบชเบฐโเบซเบกเบฑเบโ
เบญเบญเบเบเปเบฒเบชเบฐเบเบฃเบตเบกเบเบฑเบเปเบปเบเบเบทเบเปเปเปเบชเบณเบฅเบฑเบเบเบฒเบเบชเบฐเปเบฑเบเบชเบฐเบกเบฒเบเบดเบเปเปเป
เปเบเบทเปเบญเปเบซเปเบเบฒเบเบเบฝเบเบเบฝเบ, เบเปเบญเบเบเบฐเบเบดเบเปเบเบดเบเบเบฐเปเบชเบฎเปเบญเบเปเบเบฑเบเบฎเบนเบเปเบเบปเบฒเปเบเปเบฎเบเบฅเบฐเบเบญเบ. เบกเบฒเบฎเบญเบเบเบธเบเปเบเบเบญเบเบเบฑเปเบเปเบเบปเปเบฒเปเบฅเบตเปเบกเปเบเบดเปเบ. เบเปเบญเบเบเบฐเบเบฝเบเบเบฝเบเบเบฒเบเปเบซเบผเปเบขเบฑเบเบเบฑเบเบเบฒเบเปเบเปเบเปเบเบฑเบเปเบเปเบฅเบขเบต. เบชเบฐเบซเบเบฑเบเบชเบฐเบซเบเบนเบ. เบเบนเปเปเบเบเบปเบเปเบเบเปเปเบเปเบเบฑเบเบเบฒเบเบเบฑเบเบเบถเบเบเปเปเบเบงเบฒเบกเบชเบฝเบเบเบฑเปเบเปเบเปเบเบปเปเบเบเบปเบเบเบปเบ, เปเบเปเบเปเบฒเบเบชเบฒเบกเบฒเบเบงเบฒเบเบชเบฒเบเปเบเปเปเบเบเบเบฒเบเบเบปเบเปเบฅเบตเบเบเบฒเบเบฎเบฑเบเบเปเบฒเบงเบชเบฒเบ.
เบเปเบฒเบเบฐเปเบเบปเปเบฒเบขเบฒเบเบเบฐเบชเบฑเบเปเบเบเบงเปเบฒเบเบฑเบเบกเบตเบญเบฑเบเบเบตเปเปเบญเบตเปเบเบงเปเบฒเบเบฐเปเบชเบเบตเปเบญเบปเบเบญเบธเปเบ (เบเปเบญเบเปเบเปเบเบปเบเบเปเบฒเบเบดเบเบฒเบกเบเบตเปเบซเบเปเบญเบเบเบตเปเบชเบธเบเปเบฅเบฐเบเบฝเบเปเบเปเบขเบนเปเปเบเบเบธเบกเบเบปเบเบเปเบฒเบเบเบฐเปเบเบเปเบเบปเปเบฒเบเบฑเปเบ) - เบเบตเปเปเบกเปเบเบเบฐเปเบชเบเบตเปเบเปเบฝเบเบเบฒเบเบเบฒเบเปเบซเบผเปเบขเบฑเบเปเบเบชเบนเปเบเบงเบฒเบกเบฎเปเบญเบ. เบเปเบฒเบเบฒเบกเบเบตเปเปเบเบตเบเบเบทเปเบ - เบเปเบญเบเบเบตเปเบเบฐเปเบเป)) เบเปเบญเบเบเบฐเปเบซเปเบเบปเบงเบขเปเบฒเบเบเบฒเบเบเบฒเบเบเบฐเบเบดเบเบฑเบ.
เบเปเบญเบเบเปเบฒเบฅเบฑเบเปเบฎเบฑเบเบงเบฝเบเบเบฑเบ Angular. เบฅเบฒเบงเปเบเป 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)
);เบเบนเปเบเบฐเบเบดเบเบฑเบเบเบฒเบเปเบซเปเบเบงเบเปเบฎเบปเบฒเบกเบตเบเบงเบฒเบกเบชเบฒเบกเบฒเบเปเบเบเบฒเบเบเบฐเบซเบเบฒเบเบเบงเบฒเบกเบชเบฒเบกเบฒเบเปเบเบเบฒเบเปเบฎเบฑเบเบงเบฝเบเบเบฑเบเบชเบฒเบเบเปเปเบฒ. เบเบงเบเปเบเบปเบฒเบเปเบงเบเบเบงเบเบเบธเบกเปเบซเบเบเบฒเบเบเบตเปเปเบเบตเบเบเบถเปเบเปเบ Observable. เบเบงเบเปเบฎเบปเบฒเบเบฐเปเบเบดเปเบเบชเบญเบเบชเบฒเบกเบญเบฑเบเบเบตเปเบกเบตเบเบงเบฒเบกเบเบดเบเบปเบกเบซเบฅเบฒเบเบเบตเปเบชเบธเบ, เปเบฅเบฐเบฅเบฒเบเบฅเบฐเบญเบฝเบเปเบเบตเปเบกเปเบเบตเบกเบเปเบฝเบงเบเบฑเบเบเบนเปเบเบฐเบเบดเบเบฑเบเบเบฒเบเบชเบฒเบกเบฒเบเบเบปเบเปเบเปเปเบเบเปเบเปเบเบฒเบเปเบเบทเปเบญเบกเบเปเปเปเบเบเปเปเบกเบนเบเบเบตเปเปเบเบฑเบเบเบฐเปเบซเบเบ.
เบเบนเปเบเบฐเบเบญเบเบเบฒเบ - เบเบญเบ
เปเบซเปเปเบฅเบตเปเบกเบเบปเปเบเบเปเบงเบเบเบปเบงเบเบฐเบเบดเบเบฑเบเบเบฒเบเบเปเบงเบเบเบญเบ. เบกเบฑเบเบชเปเบฒเบ Observable เปเบเบเบญเบตเบเปเบชเปเบกเบนเบเบเปเบฒเบเบตเปเบเปเบฒเบเบเบฒเบ.
เบเบนเปเบเบฐเบเบญเบเบเบฒเบ - เบเบฒเบเบเบฑเปเบเบเบญเบ
เบเบปเบงเบเบฐเบเบดเบเบฑเบเบเบฒเบเบเบฒเบเบเบฑเปเบเบเบญเบ, เบเบฒเบกเบเบทเปเปเบเบฐเบเปเบฒ, เบเบฒเบเบเบฑเปเบเบเบญเบเบชเบฑเบเบเบฒเบเบเบฒเบเบเปเบฒเบเบเบญเบ. เบเปเบฒเบเบนเปเบเบฐเบเบดเบเบฑเบเบเบฒเบเบเบฑเบเบเบทเบเบเบงเบฒเบกเบเบดเบ, เบกเบฑเบเบเบฐเบเปเบฒเบกเปเบเบเบทเปเบกเบญเบตเบ.
เบเบนเปเบเบฐเบเบญเบเบเบฒเบ - เปเบญเบปเบฒ
เปเบญเบปเบฒ - เปเบญเบปเบฒเบกเบนเบเบเปเบฒเบเบญเบเบเปเบฒเบเบงเบเบเบญเบ emitters, เบซเบผเบฑเบเบเบฒเบเบเบตเป thread เบชเบดเปเบเบชเบธเบเบฅเบปเบ.
เบเบนเปเบเบฐเบเบญเบเบเบฒเบ - debounceTime
debounceTime - เบเบปเบเปเบฅเบตเบเบเปเบฒ emitted เบเบตเปเบเบปเบเบขเบนเปเบเบฒเบเปเบเปเบฅเบเบฐเปเบงเบฅเบฒเบเบตเปเบเปเบฒเบเบปเบเบฅเบฐเบซเบงเปเบฒเบเบเบปเบเปเบเปเบฎเบฑเบ - เบซเบผเบฑเบเบเบฒเบเปเบฅเบเบฐเปเบงเบฅเบฒเปเบเปเบเปเบฒเบเปเบ, emits เบเปเบฒเบชเบธเบเบเปเบฒเบ.
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)
);
เบเบนเปเบเบฐเบเบญเบเบเบฒเบ - takeWhile
เบเปเบญเบเบเปเบฒเบเบปเบเบเปเบงเบฒ takeWhile เบเบฑเบเบเบทเบ false, เบซเบผเบฑเบเบเบฒเบเบเบฑเปเบเบกเบฑเบ unsubscribes เบเบฒเบ thread.
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 )
);
เบเบนเปเบเบฐเบเบญเบเบเบฒเบ - เบเบฐเบชเบปเบกเบเบฐเบชเบฒเบเบซเบผเปเบฒเบชเบธเบ
เปเบเบเบฐเบเบดเบเบฑเบเบเบฒเบ mixLatest เปเบกเปเบเบเปเบฒเบเบเบทเบเบฑเบเบเบฑเบ promise.all. เบกเบฑเบเบฅเบงเบกเบซเบผเบฒเบเบซเบปเบงเบเปเปเปเบเบปเปเบฒเปเบเปเบเบซเบเบถเปเบ. เบซเบผเบฑเบเบเบฒเบเปเบเปเบฅเบฐเบเบฐเบเบนเปเปเบฎเบฑเบเปเบซเปเบขเปเบฒเบเบซเบเปเบญเบเบซเบเบถเปเบเบเบฒเบเบเปเบญเบเบญเบฒเบเบเบดเบ, เบเบงเบเปเบฎเบปเบฒเปเบเปเบฎเบฑเบเบเปเบฒเบซเบฅเปเบฒเบชเบธเบเบเบฒเบเปเบเปเบฅเบฐเบเบปเบเปเบเบฎเบนเบเปเบเบเบเบญเบเบญเบฒเปเบฅ. เบเบญเบเบเบฒเบเบเบฑเปเบ, เบซเบผเบฑเบเบเบฒเบเบเบฒเบเบเปเบญเบเบญเบฒเบเบเบดเบเปเบเปเบเบฒเบเบชเบฒเบเบเปเปเบฒเบเบตเปเบเบฐเบชเบปเบกเบเบฐเบชเบฒเบ, เบกเบฑเบเบเบฐเปเบซเปเบเบธเบเบเปเบฒเปเบซเบกเป.
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));
เบเบนเปเบเบฐเบเบญเบเบเบฒเบ - zip
Zip - เบฅเปเบเปเบฒเบเปเบฒเบเบฒเบเปเบเปเบฅเบฐ thread เปเบฅเบฐเบเบฐเบเบญเบเปเบเบฑเบ array เปเบเบเบญเบตเบเปเบชเปเบเปเบฒเปเบซเบผเบปเปเบฒเบเบตเป. เบเปเบฒเบเปเบฒเบเปเปเปเบเปเบกเบฒเบเบฒเบเบเบฐเบเบนเปเปเบเป, เบซเบผเบฑเบเบเบฒเบเบเบฑเปเบเบเบธเปเบกเบเบฐเบเปเปเบเบทเบเบชเปเบฒเบเบเบฑเปเบเบเบถเปเบ.
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));
เบเบนเปเบเบฐเบเบญเบเบเบฒเบ - forkJoin
forkJoin เบเบฑเบเปเบเบปเปเบฒเบฎเปเบงเบกเบเบฐเบเบนเป, เปเบเปเบกเบฑเบเบเบฝเบเปเบเปเบเปเบญเบเบเปเบฒเปเบเปเบงเบฅเบฒเบเบตเปเบเบฐเบเบนเปเบเบฑเบเบซเบกเบปเบเบชเปเบฒเปเบฅเบฑเบ.
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);
เบเบนเปเบเบฐเบเบดเบเบฑเบเบเบฒเบ - เปเบเบเบเบตเป
เบเบปเบงเบเบฐเบเบดเบเบฑเบเบเบฒเบเบซเบฑเบเบเปเบฝเบเปเบเบเบเบตเปเบเบฐเบเปเบฝเบเบเปเบฒ emitter เปเบซเปเปเบเบฑเบเบญเบฑเบเปเปเป.
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)
);
เบเบนเปเบเบฐเบเบญเบเบเบฒเบ โ เปเบเปเบเบเบฑเบ, เปเบเบฐ
เบเบนเปเบเบฐเบเบดเบเบฑเบเบเบฒเบเบเบฒเบเบญเบฐเบเบธเบเบฒเบเปเบซเปเบเปเบฒเบเปเบฎเบฑเบเบเบปเบเบเปเบฒเบเบเบฝเบ, เบเบฑเปเบเปเบกเปเบ, เบเบฒเบเบเบฐเบเบดเบเบฑเบเปเบเปเบเบตเปเบเปเปเบกเบตเบเบปเบเบเบฐเบเบปเบเบเปเปเบฅเปเบฒเบเบฑเบ.
เบเบนเปเบเบฐเบเบญเบเบเบฒเบเปเบเปเบเบเบฑเบเบเบปเบเบเบฐเปเบซเบเบเบชเบฒเบกเบฒเบเบเปเบฝเบเบชเบฒเบเบเปเปเบฒเปเบขเบฑเบเปเบเบฑเบเบเปเปเบฒเบฎเปเบญเบ.
เบเบงเบเปเบฎเบปเบฒเปเบฎเบฑเบเปเบฅเปเบงเบเบฑเบเบเบนเปเบเบฐเบเบญเบเบเบฒเบ. เปเบซเปเบเปเบฒเบงเปเบเบชเบนเปเบซเบปเบงเบเปเป.
เบเบดเบเบญเบญเบเบชเบฝเบเบเบฑเบ
เปเบฅเบฐเบซเบผเบฑเบเบเบฒเบเบเบฑเปเบเบเปเบญเบเบเปเปเปเบเบเบทเปเบกเบเบฒ. เบเปเบญเบเปเบกเบทเปเบญเบเบเบฑเบเบเบปเบงเบขเปเบฒเบเปเบซเบผเบปเปเบฒเบเบตเป๐
เบเบญเบเบเบปเบงเบงเบดเบเบฒ
เบเบญเบโเบเบปเบงโเบซเบปเบงโเบเปเปโเปเบเบฑเบโเบเบปเบงโเบขเปเบฒเบโเบเบตเปโเบชเปเบฒโเบเบฑเบโเบเบญเบโเบเบฒเบโเบเบฐโเปเบชโเบฎเปเบญเบโ. เบซเปเบญเบเบฎเบฝเบเปเบซเบผเบปเปเบฒเบเบตเปเปเบกเปเบเบเบฐเปเบเบเบเบญเบเบเบฒเบเบเบฐเบชเบปเบกเบเบตเปเบเบฐเบเบดเบเบฑเบเบเปเบญเบกเปเบเบฑเบเปเบเบฑเบเบเบนเปเบชเบฑเบเปเบเบเปเบฅเบฐเบเบนเปเบชเบฑเบเปเบเบเบเบฒเบ. เปเบเบทเปเบญเบเบเบฒเบเบซเบปเบงเบเปเปเปเบเบฑเบเบซเบปเบงเบเปเปเบฎเปเบญเบ, เบกเบฑเบเบเปเบฒเปเบเบฑเบเบเปเบญเบเบเบปเบเปเบฅเบตเบเบเบฒเบเบเบญเบเบกเบฑเบ. เบเปเบฒเบเบงเบเปเบฎเบปเบฒเปเบงเบปเปเบฒเบเปเบฝเบงเบเบฑเบเบงเบดเบเบตเบเบปเปเบเบเป, เปเบซเบผเบปเปเบฒเบเบตเปเปเบกเปเบ:
- เบเปเปเปเบ โ เบเบฒเบเปเบญเบเบเปเปเบกเบนเบเปเปเปเปเบชเปเบเบฐเปเบช
- error โ เบเบงเบฒเบกโเบเบดเบโเบเบฒเบโเปเบฅเบฐโเบเบฒเบโเบเบดเบโเบเบฐโเบเบนเปโ
- เบชเปเบฒเปเบฅเบฑเบ - เบชเปเบฒเปเบฅเบฑเบเบเบญเบเบเบฐเบเบนเป
- เบเบญเบ - เบชเบฐโเปเบฑเบโเปเบเปโเบเบฒเบโเบชเบฐโเบโเบฃเบตเบกโ
- unsubscribe โ เบเบปเบโเปเบฅเบตเบโเบเบฒเบโเบชเบฐโเบโเบฃเบตเบกโ
- asObservable โ เบเปเบฝเบโเปเบเบฑเบโเบเบนเปโเบชเบฑเบโเปเบเบโเบเบฒเบโ
- to Promise โ เบเปเบฝเบโเปเบเบฑเบโเบเปเบฒโเบชเบฑเบโเบเบฒโ
เบกเบต 4 5 เบเบฐเปเบเบเบงเบดเบเบฒ.
เบเบดเบเบญเบญเบเบชเบฝเบเบเบฑเบ
เบกเบตเบเบปเบเปเบงเบปเปเบฒเบขเบนเป 4 เบเบปเบเปเบเบเบฐเปเบช, เปเบเปเบเบฐเบเบปเบเบงเปเบฒเปเบเบปเบฒเปเบเบปเปเบฒเปเบเปเปเบเบตเปเบกเบญเบตเบเปเบถเปเบเบเบปเบ. เบเปเบญเบเบงเปเบฒเปเบเบปเบฒเปเบเบปเปเบฒเปเบงเบปเปเบฒเบงเปเบฒ, เบเปเบฒเบฅเบปเบเบเบตเบงเบดเบเปเบฅเบฐเบฎเบฝเบเบฎเบนเป.
เบงเบดเบเบฒเบเปเบฒเบเบเบฒเบ new Subject()- เบเบฐโเปเบเบโเบเบญเบโเบงเบดโเบเบฒโเบเบตเปโเบเปเบฒเบโเบเบตเปโเบชเบธเบโ. เบชเปเบฒเบเปเบเบเบเปเปเบกเบตเบเบฒเบฅเบฒเบกเบดเปเบเบต. เบชเบปเปเบเบเปเบฒเบเบตเปเปเบเปเบฎเบฑเบเบเบฝเบเปเบเปเบซเบผเบฑเบเบเบฒเบเบเบฒเบเบชเบฐเบซเบกเบฑเบ.
เบเบถเบเบเบดเบเปเบฒ new BehaviorSubject( defaultData<T> ) - เปเบเบเบงเบฒเบกเบเบดเบเปเบซเบฑเบเบเบญเบเบเปเบญเบ, เบเบฐเปเบเบเบเบปเปเบงเปเบเบเบตเปเบชเบธเบเบเบญเบเบซเบปเบงเบเปเป. เบเบฒเบเบเปเบญเบเบเปเปเบกเบนเบเปเบญเบปเบฒเบเปเบฒเปเบฅเบตเปเบกเบเบปเปเบ. เบชเบฐเปเบซเบกเบตเบเบฑเบเบเบถเบเบเปเปเบกเบนเบเบเบญเบเบเบฑเบเบซเบฒเบชเบธเบเบเปเบฒเบ, เปเบเบดเปเบเบเบทเบเบชเบปเปเบเบเปเปเปเบเปเบงเบฅเบฒเบเบตเปเบชเบฐเบซเบกเบฑเบ. เบเบฑเปเบเบฎเบฝเบเบเบตเปเบเบฑเบเบกเบตเบงเบดเบเบตเบเบฒเบเบกเบนเบเบเปเบฒเบเบตเปเปเบเบฑเบเบเบฐเปเบซเบเบ, เปเบเบดเปเบเบชเบปเปเบเบเบทเบเบเปเบฒเบเบฐเบเบธเบเบฑเบเบเบญเบเบเบฐเปเบช.
ReplaySubject new ReplaySubject(bufferSize?: number, windowTime?: number) โ เบเบฒเบเบเปเบญเบเบเปเปเบกเบนเบเบชเบฒเบกเบฒเบเปเบฅเบทเบญเบเปเบเปเบงเปเบฒเปเบเบฑเบเบเบฒเบเปเบเปเบเบฝเบเบเปเบฒเบญเบดเบเบเบฐเบซเบเบฒเบเบเบญเบ buffer เบเบญเบเบกเบนเบเบเปเบฒเบเบตเปเบกเบฑเบเบเบฐเปเบเบฑเบเบฎเบฑเบเบชเบฒเปเบงเปเปเบเบเบปเบงเบกเบฑเบเปเบญเบ, เปเบฅเบฐเปเบเบฑเบเบเบฑเปเบเบเบตเบชเบญเบเปเบเปเบงเบฅเบฒเบเบตเปเบเบงเบเปเบฎเบปเบฒเบเปเบญเบเบเบฒเบเบเบฒเบเบเปเบฝเบเปเบเบ.
AsyncSubject new AsyncSubject() โ เบเปเปโเบกเบตโเบซเบเบฑเบโเปเบเบตเบโเบเบถเปเบโเปเบโเปเบงโเบฅเบฒโเบเบตเปโเบชเบฐโเบซเบกเบฑเบโ, เปเบฅเบฐโเบกเบนเบโเบเปเบฒโเบเบฐโเปเบเปโเบฎเบฑเบโเบเบฑเบโเบเบทเบโเบกเบฒโเบเบฝเบโเปเบเปโเปเบกเบทเปเบญโเบชเปเบฒโเปเบฅเบฑเบโ. เบเบฝเบเปเบเปเบเปเบฒเบชเบธเบเบเปเบฒเบเบเบญเบเบเบฐเปเบชเบเบฐเบเบทเบเบชเบปเปเบเบเบทเบ.
WebSocketSubject new WebSocketSubject(urlConfigOrSource: string | WebSocketSubjectConfig<T> | Observable<T>, destination?: Observer<T>) โ เปเบญเบเบฐเบชเบฒเบเปเบกเปเบเบกเบดเบเบเบฝเบเบเปเบฝเบงเบเบฑเบเบฅเบฒเบง เปเบฅเบฐเบเปเบญเบเปเบซเบฑเบเบฅเบฒเบงเปเบเบฑเบเปเบเบทเปเบญเบเบณเบญเบดเบ. เบเปเบฒเปเบเบฎเบนเปเบงเปเบฒเบฅเบฒเบงเปเบฎเบฑเบเบซเบเบฑเบ, เบเบฐเบฅเบธเบเบฒเบเบฝเบเปเบฅเบฐเบเบงเบเปเบฎเบปเบฒเบเบฐเปเบเบตเปเบกเบกเบฑเบ.
เบเบตเบง. เปเบฅเปเบง, เบเบงเบเปเบฎเบปเบฒเปเบเปเบเบงเบกเปเบญเบปเบฒเบเบธเบเบขเปเบฒเบเบเบตเปเบเปเบญเบเบเปเบญเบเบเบฒเบเบเบญเบเปเบเบปเปเบฒเปเบเบกเบทเปเบเบตเป. เบเปเบญเบเบซเบงเบฑเบเบงเปเบฒเบเปเปเบกเบนเบเบเบตเปเปเบเบฑเบเบเบฐเปเบซเบเบ. เบเปเบฒเบเบชเบฒเบกเบฒเบเบญเปเบฒเบเบฅเบฒเบเบเบทเปเบเบฒเบเบญเปเบฒเบเบญเบตเบเบเบปเบงเบเปเบฒเบเปเบญเบเปเบเปเบเบเบเปเปเบกเบนเบเบเบตเปเปเบเบฑเบเบเบฐเปเบซเบเบ.
เบเปเปเบกเบนเบเบเบตเปเปเบเบฑเบเบเบฐเปเบเบ
เปเบซเบผเปเบเบเปเปเบกเบนเบ: www.habr.com