ආයුබෝවන් සියල්ලටම. සර්ජි ඔමෙල්නිට්ස්කි සම්බන්ධ වේ. බොහෝ කලකට පෙර මම ප්රතික්රියාශීලී ක්‍රමලේඛනය පිළිබඳ ප්රවාහයක් සත්කාරකත්වය දැරුවෙමි, එහිදී මම JavaScript හි අසමමුහුර්තතාව ගැන කතා කළෙමි. අද මම මෙම ද්රව්යය ගැන සටහන් කිරීමට කැමතියි.
නමුත් අපි ප්රධාන ද්රව්යය ආරම්භ කිරීමට පෙර, අපි හඳුන්වාදීමේ සටහනක් කළ යුතුය. එබැවින් අපි අර්ථ දැක්වීම් සමඟ ආරම්භ කරමු: තොගයක් සහ පෝලිමක් යනු කුමක්ද?
ගොඩගැසීම LIFO පදනමින් අවසාන වශයෙන්, ප්‍රථමයෙන් පිටතට යන මූලද්‍රව්‍ය ලබා ගන්නා එකතුවකි
පෝලිම් ප්‍රථමයෙන්, පළමුවෙන් පිටතට FIFO පදනම මත මූලද්‍රව්‍ය ලබා ගන්නා එකතුවකි
හරි, අපි දිගටම කරගෙන යමු.
JavaScript යනු තනි නූල් සහිත ක්‍රමලේඛන භාෂාවකි. මෙයින් අදහස් වන්නේ ක්රියාත්මක කිරීම සඳහා ශ්‍රිතයන් පෝලිම් කර ඇති ක්රියාත්මක කිරීමේ නූල් එකක් සහ එක් තොගයක් පමණක් ඇති බවයි. එබැවින්, JavaScript එක වරකට එක් මෙහෙයුමක් පමණක් සිදු කළ හැකි අතර, අනෙකුත් මෙහෙයුම් ඔවුන් කැඳවන තෙක් තොගය සක්‍රිය කර බලා සිටියි.
ඇමතුම් තොගය යනු සරලව කිවහොත්, අප සිටින වැඩසටහනේ ස්ථානය පිළිබඳ තොරතුරු වාර්තා කරන දත්ත ව්‍යුහයකි. අපි ශ්‍රිතයකට ගියහොත්, අපි එහි ප්‍රවේශය තොගයේ ඉහළට තල්ලු කරමු. අපි ශ්‍රිතයකින් ආපසු එන විට, අපි අට්ටියෙන් ඉහළම මූලද්‍රව්‍යය පොප් කර අවසානයේ අපි ශ්‍රිතය හැඳින්වූ ස්ථානයට පැමිණෙමු. තොගයට කළ හැක්කේ මෙයයි. දැන් අතිශයින්ම සිත්ගන්නා ප්රශ්නයක්. එසේනම් ජාවාස්ක්‍රිප්ට් හි අසමමුහුර්තය ක්රියා කරන්නේ කෙසේද?
ඇත්ත වශයෙන්ම, තොගයට අමතරව, ඊනියා WebAPI සමඟ වැඩ කිරීම සඳහා බ්‍රව්සර්වලට විශේෂ පෝලිමක් ඇත. මෙම පෝලිමේ ඇති කාර්යයන් අනුපිළිවෙලින් ක්රියාත්මක වන්නේ තොගය සම්පූර්ණයෙන්ම ඉවත් කිරීමෙන් පසුව පමණි. ක්රියාත්මක කිරීම සඳහා ඔවුන් පෝලිමේ සිට තොගය මතට තල්ලු කරනු ලබන්නේ මෙයින් පසුවය. මේ මොහොතේ තොගයේ අවම වශයෙන් එක් මූලද්‍රව්‍යයක් තිබේ නම්, ඒවා අට්ටියට එක් කළ නොහැක. එය පිරී ඇති විට ශ්‍රිතයට පෝලිමේ සිට තොගයට යා නොහැකි බැවින්, කල් ඉකුත්වීමෙන් ශ්‍රිත ඇමතීම බොහෝ විට නියමිත වේලාවට සිදු නොවේ.
පහත උදාහරණය දෙස බලා එහි පියවරෙන් පියවර ක්රියාත්මක කිරීම ආරම්භ කරමු. සිස්ටම් එකේ මොකද වෙන්නේ කියලත් බලමු.
console.log('Hi');
setTimeout(function cb1() {
console.log('cb1');
}, 5000);
console.log('Bye');
1) තවමත් කිසිවක් සිදු නොවේ. බ්‍රව්සර් කොන්සෝලය පැහැදිලිය, ඇමතුම් තොගය හිස්ය.
2) එවිට console.log('Hi') විධානය ඇමතුම් තොගයට එකතු වේ.
3) එය ඉටු වේ
4) එවිට console.log('Hi') ඇමතුම් තොගයෙන් ඉවත් වේ.
5) දැන් setTimeout(function cb1() {… }) විධානය වෙත යන්න. එය ඇමතුම් තොගයට එකතු වේ.
6) setTimeout(function cb1() {… }) විධානය ක්රියාත්මක වේ. බ්‍රවුසරය Web API හි කොටසක් වන ටයිමරයක් නිර්මාණය කරයි. එය ගණන් කිරීමක් සිදු කරනු ඇත.
7) setTimeout(function cb1() {... }) විධානය එහි කාර්යය සම්පූර්ණ කර ඇති අතර ඇමතුම් තොගයෙන් ඉවත් කර ඇත.
8) console.log('Bye') විධානය ඇමතුම් තොගයට එකතු වේ.
9) console.log('Bye') විධානය ක්රියාත්මක වේ.
10) console.log('Bye') විධානය ඇමතුම් තොගයෙන් ඉවත් කර ඇත.
11) අවම වශයෙන් ms 5000 ක් ගත වූ පසු, ටයිමරය අවසන් වන අතර නැවත ඇමතුම් පෝලිමේ Cb1 ස්ථානගත කරයි.
12) සිද්ධි ලූපය ආපසු ඇමතුම් පෝලිමෙන් cb1 ශ්‍රිතය ගෙන එය ඇමතුම් තොගයේ තබයි.
13) cb1 ශ්‍රිතය ක්රියාත්මක වන අතර ඇමතුම් තොගයට console.log('cb1') එක් කරයි.
14) console.log('cb1') විධානය ක්රියාත්මක වේ.
15) console.log('cb1') විධානය ඇමතුම් තොගයෙන් ඉවත් කර ඇත.
16) cb1 ශ්‍රිතය ඇමතුම් තොගයෙන් ඉවත් කෙරේ.
ගතිකයේ උදාහරණයක් බලමු:
හොඳයි, අපි ජාවාස්ක්‍රිප්ට් හි අසමමුහුර්තකරණය ක්රියාත්මක කරන්නේ කෙසේදැයි සොයා බැලුවෙමු. දැන් අපි අසමමුහුර්ත කේතයේ පරිණාමය ගැන කෙටියෙන් කතා කරමු.
අසමමුහුර්ත කේතයේ පරිණාමය.
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);
})
})
})
})
})
});JavaScript හි අප දන්නා අසමමුහුර්ත ක්‍රමලේඛනය ක්රියාත්මක කළ හැක්කේ ශ්‍රිත මගින් පමණි. ඒවා වෙනත් ඕනෑම විචල්‍යයක් මෙන් වෙනත් ශ්‍රිතවලට සම්මත කළ හැක. ආපසු කැඳවීම් ඉපදුණේ මේ ආකාරයටයි. එය දුක, ශෝකය සහ දුක බවට හැරෙන තුරු එය සිසිල්, විනෝදජනක සහ සෙල්ලක්කාර ය. ඇයි? ඒක සරලයි:
- කේතයේ සංකීර්ණත්වය වැඩි වන විට, ව්‍යාපෘතිය ඉක්මනින් නොපැහැදිලි, නැවත නැවතත් කැදලි කුට්ටි බවට පත්වේ - “ආමන්ත්‍රණය නිරය”.
- දෝෂ හැසිරවීම මග හැරීමට පහසු විය හැකිය.
- ඔබට ප්‍රකාශන ආපසු හැරීම සමඟ ආපසු ලබා දිය නොහැක.
පොරොන්දුව පැමිණීමත් සමඟ තත්වය ටිකක් හොඳ විය.
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 භාවිතයෙන් සමාන්තරව ක්රියාත්මක කිරීමේ හැකියාව එක් කරන ලදී
- අපට async/await භාවිතයෙන් nested asynchrony විසඳිය හැක
නමුත් පොරොන්දුවලට ඔවුන්ගේ සීමාවන් තිබේ. නිදසුනක් වශයෙන්, රබන් සමඟ නැටීමෙන් තොරව පොරොන්දුවක් අවලංගු කළ නොහැකි අතර, වඩාත්ම වැදගත් වන්නේ එය එක් අගයක් සමඟ ක්රියා කිරීමයි.
හොඳයි, අපි ප්රතික්රියාශීලී වැඩසටහන්කරණයට සුමටව ප්‍රවේශ වී ඇත. මහන්සිද? හොඳයි, වාසනාවකට මෙන්, ඔබට තේ ටිකක් සාදා ගැනීමට ගොස්, ඒ ගැන සිතා බලා වැඩිදුර කියවීමට නැවත එන්න. තවද මම දිගටම කරගෙන යන්නෙමි.
ප්රතික්රියාශීලී වැඩසටහන්කරණය දත්ත ප්‍රවාහයන් සහ ප්‍රචාරණය වෙනස් කිරීම කෙරෙහි අවධානය යොමු කරන ලද ක්‍රමලේඛන ආදර්ශයකි. දත්ත ප්රවාහයක් යනු කුමක්දැයි අපි සමීපව බලමු.
// Получаем ссылку на элемент
const input = ducument.querySelector('input');
const eventsArray = [];
// Пушим каждое событие в массив eventsArray
input.addEventListener('keyup',
event => eventsArray.push(event)
);අපි හිතමු අපිට ආදාන ක්ෂේත්‍රයක් තියෙනවා කියලා. අපි අරාවක් සාදමින් සිටින අතර ආදාන සිදුවීමේ සෑම යතුරුපුවරුවක් සඳහාම අපි සිදුවීම අපගේ අරාව තුළ ගබඩා කරන්නෙමු. ඒ සමගම, අපගේ අරාව කාලය අනුව වර්ග කර ඇති බව සටහන් කිරීමට කැමැත්තෙමි, i.e. පසුකාලීන සිදුවීම්වල දර්ශකය පෙර සිදුවීම්වල දර්ශකයට වඩා වැඩි ය. එවැනි අරාවක් දත්ත ප්‍රවාහයක සරල කළ ආකෘතියකි, නමුත් එය තවමත් ප්රවාහයක් නොවේ. මෙම අරාව ආරක්ෂිතව ප්රවාහයක් ලෙස හැඳින්වීමට නම්, එයට නව දත්ත පැමිණ ඇති බව කෙසේ හෝ ග්‍රාහකයින්ට දැනුම් දීමට හැකි විය යුතුය. මේ අනුව අපි ප්රවාහයේ නිර්වචනයට පැමිණෙමු.
දත්ත ප්රවාහය
const { interval } = Rx;
const { take } = RxOperators;
interval(1000).pipe(
take(4)
)
ගලනවා දත්ත වෙනස් වී ඇති බව පෙන්නුම් කළ හැකි කාලය අනුව වර්ග කරන ලද දත්ත සමූහයකි. එක් ක්‍රියාවකට කේතයේ විවිධ කොටස්වල සිදුවීම් කිහිපයක් ඇමතීමට අවශ්‍ය වන කේතය ලිවීම කොතරම් පහසුදැයි දැන් සිතන්න. අපි සරලව ප්‍රවාහයට දායක වන අතර වෙනස්කම් සිදු වූ විට එය අපට දන්වනු ඇත. RxJs පුස්තකාලයට මෙය කළ හැකිය.
RxJS නිරීක්ෂණය කළ හැකි අනුක්‍රම භාවිතා කරමින් අසමමුහුර්ත සහ සිදුවීම් පාදක වැඩසටහන් සමඟ වැඩ කිරීම සඳහා පුස්තකාලයකි. පුස්තකාලය මූලික වර්ගයක් සපයයි නිරීක්ෂණය කළ හැකි, සහායක වර්ග කිහිපයක් (නිරීක්ෂකයා, උපලේඛනගත කරන්නන්, විෂයයන්) සහ එකතු කිරීම් සමඟ මෙන් සිදුවීම් සමඟ වැඩ කිරීම සඳහා ක්රියාකරුවන් (සිතියම, පෙරහන, අඩු කිරීම, සෑම සහ JavaScript Array වෙතින් සමාන ඒවා).
මෙම පුස්තකාලයේ මූලික සංකල්ප තේරුම් ගනිමු.
නිරීක්ෂණය කළ හැකි, නිරීක්ෂකයා, නිෂ්පාදකයා
නිරීක්ෂණය කළ හැකි පළමු මූලික වර්ගය අපි බලමු. මෙම පන්තියේ RxJs ක්රියාත්මක කිරීමේ ප්රධාන කොටස අඩංගු වේ. එය නිරීක්ෂණය කළ හැකි ප්රවාහයක් සමඟ සම්බන්ධ වී ඇති අතර, දායක ක්‍රමය භාවිතා කිරීමට දායක විය හැක.
නිරීක්ෂණය කළ හැකි යාවත්කාල කිරීම් නිර්මාණය කිරීම සඳහා උපකාරක යාන්ත්රණයක් ක්රියාත්මක කරයි, ඊනියා ඔබ්සර්වර්. Observer සඳහා අගයන් මූලාශ්රය ලෙස හැඳින්වේ නිෂ්පාදක. මෙය අරාවක්, පුනරාවර්තකයක්, වෙබ් සොකට්, යම් ආකාරයක සිදුවීමක් යනාදිය විය හැකිය. ඉතින් අපිට කියන්න පුළුවන් observable කියන්නේ Producer සහ Observer අතර සන්නායකයක් කියලා.
නිරීක්ෂණය කළ හැකි නිරීක්ෂක සිදුවීම් වර්ග තුනක් හසුරුවයි:
- ඊළඟ - නව දත්ත
- දෝෂය - ව්‍යතිරේකයක් හේතුවෙන් අනුපිළිවෙල අවසන් වූයේ නම් දෝෂයකි. මෙම සිදුවීම අනුපිළිවෙල සම්පූර්ණ කිරීම ද ඇඟවුම් කරයි.
- සම්පූර්ණ - අනුපිළිවෙල සම්පූර්ණ කිරීම පිළිබඳ සංඥාව. මෙයින් අදහස් කරන්නේ තවත් නව දත්ත නොමැති බවයි.
අපි demo එක බලමු:
ආරම්භයේදී අපි 1, 2, 3 සහ තත්පර 1 ට පසුව අගයන් සකසන්නෙමු. අපි 4 ලබාගෙන අපගේ ප්රවාහය අවසන් කරන්නෙමු.
හයියෙන් කල්පනා කරනවා
එතකොට මට තේරුණා ඒ ගැන ලියනවට වඩා ඒක කියන එක රසවත් කියලා. 😀
දායකත්ව
අපි ප්‍රවාහයකට දායක වූ විට අපි නව පන්තියක් නිර්මාණය කරමු දායකත්වයක්‍රමය භාවිතයෙන් දායක නොවීම සඳහා අපට හැකියාව ලබා දෙයි ඉවත්වීම. ක්‍රමය භාවිතා කර ග්‍රාහකත්ව සමූහගත කිරීමටද අපට හැකිය එකතු. හොඳයි, අපට භාවිතා කර නූල් සමූහගත කළ හැකි බව තර්කානුකූලයි ඉවත්. එකතු කිරීමේ සහ ඉවත් කිරීමේ ක්රම වෙනත් දායකත්වයක් ආදානය ලෙස පිළිගනී. අපි දායකත්වයෙන් ඉවත් වූ විට, ඔවුන් දායක නොවීමේ ක්‍රමය ලෙස හැඳින්වූවාක් මෙන්, අපි සියලුම ළමා දායකත්වයෙන් දායක නොවන බව සටහන් කිරීමට කැමැත්තෙමි. ඉදිරියට යන්න.
ධාරා වර්ග
උණුසුම්
සීතල
නිෂ්පාදකයා නිර්මාණය කර ඇත්තේ නිරීක්ෂණය කළ නොහැකි ලෙසිනි
නිෂ්පාදකයා නිර්මාණය වී ඇත්තේ නිරීක්ෂණය කළ හැකි ඇතුළත ය
නිරීක්ෂණය කළ හැකි දේ නිර්මාණය කරන අවස්ථාවේදී දත්ත මාරු කරනු ලැබේ
දායක වන අවස්ථාවේදී දත්ත සපයනු ලැබේ
දායක නොවීම සඳහා අමතර තර්කයක් අවශ්‍ය වේ
නූල් තනිවම අවසන් වේ
එක-බොහෝ සබඳතාවක් භාවිතා කරයි
එකින් එක සම්බන්ධයක් භාවිතා කරයි
සියලුම දායකත්වයන් එකම අර්ථයක් ඇත
දායකත්ව ස්වාධීන වේ
ඔබට දායකත්වයක් නොමැති නම් දත්ත නැති විය හැක
නව දායකත්වයක් සඳහා සියලුම ප්රවාහ අගයන් නැවත නිකුත් කරයි
සාදෘශ්‍යයක් දීමට නම්, මම උණුසුම් ප්රවාහයක් සිනමා ශාලාවක චිත්‍රපටයක් ලෙස සිතමි. ඔබ පැමිණියේ කුමන වේලාවකද, ඒ මොහොතේ සිට ඔබ නැරඹීමට පටන් ගත්තේය. මම සීතල ප්රවාහයක් තාක්‍ෂණයේ ඇමතුමකට සංසන්දනය කරමි. සහාය. ඕනෑම ඇමතුමක් ආරම්භයේ සිට අවසානය දක්වා හඬ තැපෑල පටිගත කිරීමට සවන් දෙයි, නමුත් ඔබට දායක නොවීම භාවිතයෙන් විසන්ධි කළ හැක.
ඊනියා උණුසුම් ප්‍රවාහයන් ද ඇති බව සටහන් කිරීමට කැමැත්තෙමි (මෙම නිර්වචනය මට හමු වී ඇත්තේ අතිශයින් කලාතුරකිනි සහ විදේශීය ප්‍රජාවන් තුළ පමණි) - මෙය සීතල ප්‍රවාහයක සිට උණුසුම් එකක් දක්වා පරිවර්තනය වන ප්‍රවාහයකි. ප්රශ්නය පැනනගින්නේ - භාවිතා කිරීමට කොහෙද)) මම ප්රායෝගිකව උදාහරණයක් දෙන්නෙමි.
මම වැඩ කරන්නේ 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)
);ප්රවාහ සමඟ වැඩ කිරීමේ අපගේ හැකියාව පුළුල් කිරීමට ක්රියාකරුවන් අපට හැකියාව ලබා දෙයි. ඒවා නිරීක්ෂණය කළ හැකි සිදුවීම් පාලනය කිරීමට උපකාරී වේ. අපි වඩාත් ජනප්‍රිය ඒවා කිහිපයක් දෙස බලමු, සහ ක්රියාකරුවන් පිළිබඳ වැඩි විස්තර ප්රයෝජනවත් තොරතුරු වල ඇති සබැඳි භාවිතයෙන් සොයාගත හැකිය.
ක්රියාකරුවන් - ක
හි සහායක ක්රියාකරු සමඟ ආරම්භ කරමු. එය සරල අගයක් මත පදනම්ව නිරීක්‍ෂණයක් නිර්මාණය කරයි.
ක්රියාකරුවන් - පෙරහන
පෙරහන් ක්රියාකරු, නමට අනුව, ප්රවාහ සංඥා පෙරහන් කරයි. ක්රියාකරු සත්‍ය ලෙස ලබා දෙන්නේ නම්, එය තවදුරටත් මඟ හැරේ.
ක්රියාකරුවන් - ගන්න
ගන්න - නූල් අවසන් වන විමෝචක ගණනේ අගය ගනී.
ක්රියාකරුවන් - debounceTime
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)
);
ක්රියාකරුවන් - takeWhile
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 )
);
ක්රියාකරුවන් - ඒකාබද්ධ නවතම
combineLatest ක්රියාකරු පොරොන්දු.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 එකකින් value එක එන්නේ නැත්තම් group එක හැදෙන්නේ නෑ.
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);
ක්රියාකරුවන් - සිතියම
සිතියම් පරිවර්තන ක්රියාකරු විමෝචක අගය නව එකක් බවට පරිවර්තනය කරයි.
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)
);
ක්රියාකරුවන් - බෙදාගන්න, තට්ටු කරන්න
ටැප් ක්රියාකරු ඔබට අතුරු ආබාධ කිරීමට ඉඩ සලසයි, එනම්, අනුපිළිවෙලට බලපාන්නේ නැති ඕනෑම ක්රියාවක්.
කොටස් උපයෝගිතා ක්රියාකරුට සීතල ප්රවාහයක් උණුසුම් එකක් බවට පත් කළ හැකිය.
අපි ක්රියාකරුවන් සමඟ කටයුතු කර අවසන්. අපි Subject එකට යමු.
හයියෙන් කල්පනා කරනවා
ඊට පස්සේ මම තේ එකක් බොන්න ගියා. මට මේ උදාහරණ එපා වෙලා 😀
විෂය පවුල
විෂය පවුල උණුසුම් ප්රවාහ සඳහා ප්රධාන උදාහරණයකි. මෙම පන්ති නිරීක්ෂණය කළ හැකි සහ නිරීක්ෂකයෙකු ලෙස එකවර ක්රියා කරන දෙමුහුන් වර්ගයකි. විෂය උණුසුම් ත්‍රෙඩ් එකක් බැවින්, එයින් දායක නොවීම අවශ්‍ය වේ. අපි ප්රධාන ක්රම ගැන කතා කරන්නේ නම්, ඒවා නම්:
- ඊළඟ - ධාරාව වෙත නව දත්ත මාරු කිරීම
- දෝෂය - දෝෂය සහ නූල් අවසන් කිරීම
- සම්පූර්ණ - නූල් සම්පූර්ණ කිරීම
- දායක වන්න - ප්‍රවාහයකට දායක වන්න
- unsubscribe - ප්‍රවාහයෙන් දායක නොවන්න
- නිරීක්ෂණය කළ හැකි ලෙස - නිරීක්ෂකයෙකු බවට පරිවර්තනය
- toPromise - පොරොන්දුවක් බවට පරිවර්තනය වේ
විෂයන් වර්ග 4ක් ඇත.
හයියෙන් කල්පනා කරනවා
ප්රවාහයේ 4 දෙනෙක් කතා කරමින් සිටි නමුත් ඔවුන් තවත් එක් අයෙකු එකතු කර ඇති බව පෙනී ගියේය. ඔවුන් පවසන පරිදි, ජීවත් වී ඉගෙන ගන්න.
සරල විෂය new Subject()- සරලම ආකාරයේ විෂයයන්. පරාමිතීන් නොමැතිව නිර්මාණය කර ඇත. දායකත්වයෙන් පසුව පමණක් ලැබුණු අගයන් සම්ප්රේෂණය කරයි.
හැසිරීම විෂය 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