జావాస్క్రిప్ట్‌లో అసమకాలిక ప్రోగ్రామింగ్ (కాల్‌బ్యాక్, ప్రామిస్, RxJs)

అందరికి వందనాలు. సెర్గీ ఒమెల్నిట్స్కీ టచ్‌లో ఉన్నారు. కొంతకాలం క్రితం నేను రియాక్టివ్ ప్రోగ్రామింగ్‌పై స్ట్రీమ్‌ను హోస్ట్ చేసాను, అక్కడ నేను జావాస్క్రిప్ట్‌లో అసమకాలికత గురించి మాట్లాడాను. ఈ రోజు నేను ఈ విషయంపై గమనికలు తీసుకోవాలనుకుంటున్నాను.

జావాస్క్రిప్ట్‌లో అసమకాలిక ప్రోగ్రామింగ్ (కాల్‌బ్యాక్, ప్రామిస్, RxJs)

కానీ మేము ప్రధాన పదార్థాన్ని ప్రారంభించే ముందు, మేము పరిచయ గమనికను తయారు చేయాలి. కాబట్టి నిర్వచనాలతో ప్రారంభిద్దాం: స్టాక్ మరియు క్యూ అంటే ఏమిటి?

స్టాక్ ఒక సేకరణ, దీని మూలకాలు చివరిగా, మొదటగా LIFO ప్రాతిపదికన పొందబడతాయి

మలుపు ఫస్ట్-ఇన్, ఫస్ట్-అవుట్ FIFO ప్రాతిపదికన మూలకాలు పొందే సేకరణ

సరే, కొనసాగిద్దాం.

జావాస్క్రిప్ట్‌లో అసమకాలిక ప్రోగ్రామింగ్ (కాల్‌బ్యాక్, ప్రామిస్, RxJs)

జావాస్క్రిప్ట్ అనేది సింగిల్-థ్రెడ్ ప్రోగ్రామింగ్ లాంగ్వేజ్. దీనర్థం కేవలం ఒకే ఒక థ్రెడ్ ఎగ్జిక్యూషన్ మరియు ఒక స్టాక్‌లో ఫంక్షన్‌లు అమలు కోసం క్యూలో ఉంటాయి. అందువల్ల, జావాస్క్రిప్ట్ ఒక సమయంలో ఒక ఆపరేషన్ మాత్రమే చేయగలదు, అయితే ఇతర ఆపరేషన్‌లు వాటిని పిలిచే వరకు స్టాక్‌పై తమ వంతు వేచి ఉంటాయి.

కాల్ స్టాక్ కేవలం చెప్పాలంటే, మనం ఉన్న ప్రోగ్రామ్‌లోని స్థలం గురించి సమాచారాన్ని రికార్డ్ చేసే డేటా స్ట్రక్చర్. మనం ఒక ఫంక్షన్‌లోకి వెళితే, దాని ఎంట్రీని స్టాక్ పైభాగానికి పుష్ చేస్తాము. మనం ఒక ఫంక్షన్ నుండి తిరిగి వచ్చినప్పుడు, స్టాక్ నుండి టాప్ ఎలిమెంట్‌ను పాప్ చేసి, మనం ఫంక్షన్ అని పిలిచే చోటికి తిరిగి వస్తాము. స్టాక్ చేయగలిగినదంతా ఇదే. మరియు ఇప్పుడు చాలా ఆసక్తికరమైన ప్రశ్న. జావాస్‌స్క్రిప్ట్‌లో అసమకాలీకరణ ఎలా పని చేస్తుంది?

జావాస్క్రిప్ట్‌లో అసమకాలిక ప్రోగ్రామింగ్ (కాల్‌బ్యాక్, ప్రామిస్, RxJs)

వాస్తవానికి, స్టాక్‌తో పాటు, బ్రౌజర్‌లు WebAPI అని పిలవబడే పని కోసం ప్రత్యేక క్యూను కలిగి ఉంటాయి. స్టాక్ పూర్తిగా క్లియర్ చేయబడిన తర్వాత మాత్రమే ఈ క్యూలోని విధులు క్రమంలో అమలు చేయబడతాయి. దీని తర్వాత మాత్రమే వారు అమలు కోసం క్యూ నుండి స్టాక్‌పైకి నెట్టబడతారు. ప్రస్తుతం స్టాక్‌లో కనీసం ఒక మూలకం ఉంటే, వాటిని స్టాక్‌కు జోడించలేరు. దీని కారణంగానే ఫంక్షన్‌లు పూర్తి అయినప్పుడు క్యూ నుండి స్టాక్‌కు చేరుకోలేనందున, సమయం ముగిసే సమయానికి ఫంక్షన్‌లకు కాల్ చేయడం తరచుగా ఖచ్చితమైనది కాదు.

కింది ఉదాహరణను చూద్దాం మరియు దాని దశల వారీ అమలుతో ప్రారంభించండి. వ్యవస్థలో ఏమి జరుగుతుందో కూడా చూద్దాం.

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

జావాస్క్రిప్ట్‌లో అసమకాలిక ప్రోగ్రామింగ్ (కాల్‌బ్యాక్, ప్రామిస్, RxJs)

1) ఇంకా ఏమీ జరగడం లేదు. బ్రౌజర్ కన్సోల్ స్పష్టంగా ఉంది, కాల్ స్టాక్ ఖాళీగా ఉంది.

జావాస్క్రిప్ట్‌లో అసమకాలిక ప్రోగ్రామింగ్ (కాల్‌బ్యాక్, ప్రామిస్, RxJs)

2) అప్పుడు console.log('Hi') కమాండ్ కాల్ స్టాక్‌కు జోడించబడుతుంది.

జావాస్క్రిప్ట్‌లో అసమకాలిక ప్రోగ్రామింగ్ (కాల్‌బ్యాక్, ప్రామిస్, RxJs)

3) మరియు అది నెరవేరింది

జావాస్క్రిప్ట్‌లో అసమకాలిక ప్రోగ్రామింగ్ (కాల్‌బ్యాక్, ప్రామిస్, RxJs)

4) తర్వాత కాల్ స్టాక్ నుండి console.log('Hi') తీసివేయబడుతుంది.

జావాస్క్రిప్ట్‌లో అసమకాలిక ప్రోగ్రామింగ్ (కాల్‌బ్యాక్, ప్రామిస్, RxJs)

5) ఇప్పుడు setTimeout(ఫంక్షన్ cb1() {… }) కమాండ్‌కి వెళ్లండి. ఇది కాల్ స్టాక్‌కు జోడించబడింది.

జావాస్క్రిప్ట్‌లో అసమకాలిక ప్రోగ్రామింగ్ (కాల్‌బ్యాక్, ప్రామిస్, RxJs)

6) setTimeout(ఫంక్షన్ cb1() {… }) కమాండ్ అమలు చేయబడింది. బ్రౌజర్ వెబ్ APIలో భాగమైన టైమర్‌ను సృష్టిస్తుంది. ఇది కౌంట్ డౌన్ నిర్వహిస్తుంది.

జావాస్క్రిప్ట్‌లో అసమకాలిక ప్రోగ్రామింగ్ (కాల్‌బ్యాక్, ప్రామిస్, RxJs)

7) setTimeout(function cb1() {... }) కమాండ్ దాని పనిని పూర్తి చేసింది మరియు కాల్ స్టాక్ నుండి తీసివేయబడింది.

జావాస్క్రిప్ట్‌లో అసమకాలిక ప్రోగ్రామింగ్ (కాల్‌బ్యాక్, ప్రామిస్, RxJs)

8) కమాండ్ console.log('బై') కాల్ స్టాక్‌కు జోడించబడింది.

జావాస్క్రిప్ట్‌లో అసమకాలిక ప్రోగ్రామింగ్ (కాల్‌బ్యాక్, ప్రామిస్, RxJs)

9) console.log('బై') ఆదేశం అమలు చేయబడింది.

జావాస్క్రిప్ట్‌లో అసమకాలిక ప్రోగ్రామింగ్ (కాల్‌బ్యాక్, ప్రామిస్, RxJs)

10) కమాండ్ console.log('బై') కాల్ స్టాక్ నుండి తీసివేయబడింది.

జావాస్క్రిప్ట్‌లో అసమకాలిక ప్రోగ్రామింగ్ (కాల్‌బ్యాక్, ప్రామిస్, RxJs)

11) కనీసం 5000 ms దాటిన తర్వాత, టైమర్ ఆగిపోతుంది మరియు కాల్‌బ్యాక్ cb1ని కాల్‌బ్యాక్ క్యూలో ఉంచుతుంది.

జావాస్క్రిప్ట్‌లో అసమకాలిక ప్రోగ్రామింగ్ (కాల్‌బ్యాక్, ప్రామిస్, 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ని పొందుతాము మరియు మా ప్రసారాన్ని ముగించాము.

గట్టిగా ఆలోచిస్తున్నాను

మరియు దాని గురించి వ్రాయడం కంటే చెప్పడం చాలా ఆసక్తికరంగా ఉందని నేను గ్రహించాను. 😀

చందా

మేము స్ట్రీమ్‌కు సబ్‌స్క్రయిబ్ చేసినప్పుడు కొత్త క్లాస్‌ని క్రియేట్ చేస్తాము చందాఇది పద్ధతిని ఉపయోగించి చందాను తీసివేయగల సామర్థ్యాన్ని ఇస్తుంది అన్సబ్స్క్రయిబ్. మేము పద్ధతిని ఉపయోగించి సభ్యత్వాలను కూడా సమూహపరచవచ్చు జోడించడానికి. సరే, మనం ఉపయోగించి థ్రెడ్‌లను అన్‌గ్రూప్ చేయవచ్చు అనేది తార్కికం తొలగించడానికి. జోడించు మరియు తీసివేయి పద్ధతులు మరొక సభ్యత్వాన్ని ఇన్‌పుట్‌గా అంగీకరిస్తాయి. మేము అన్‌సబ్‌స్క్రైబ్ చేసినప్పుడు, వారు అన్‌సబ్‌స్క్రయిబ్ మెథడ్‌ని పిలిచినట్లుగా మేము అన్ని చైల్డ్ సబ్‌స్క్రిప్షన్‌ల నుండి అన్‌సబ్‌స్క్రైబ్ చేస్తాము అని నేను గమనించాలనుకుంటున్నాను. ముందుకి వెళ్ళు.

ప్రవాహాల రకాలు

హాట్
కోల్డ్

నిర్మాత పరిశీలించదగిన వెలుపల సృష్టించబడింది
నిర్మాత పరిశీలించదగిన లోపల సృష్టించబడింది

పరిశీలించదగినది సృష్టించబడిన సమయంలో డేటా బదిలీ చేయబడుతుంది
సబ్‌స్క్రిప్షన్ సమయంలో డేటా అందించబడుతుంది

చందాను తీసివేయడానికి అదనపు లాజిక్ అవసరం
థ్రెడ్ దాని స్వంతదానితో ముగుస్తుంది

ఒకటి నుండి అనేక సంబంధాన్ని ఉపయోగిస్తుంది
ఒకరితో ఒకరు సంబంధాన్ని ఉపయోగిస్తుంది

అన్ని సబ్‌స్క్రిప్షన్‌లకు ఒకే అర్థం ఉంటుంది
సభ్యత్వాలు స్వతంత్రంగా ఉంటాయి

మీకు సబ్‌స్క్రిప్షన్ లేకపోతే డేటా పోతుంది
కొత్త సబ్‌స్క్రిప్షన్ కోసం అన్ని స్ట్రీమ్ విలువలను మళ్లీ విడుదల చేస్తుంది

ఒక సారూప్యత ఇవ్వాలంటే, నేను థియేటర్‌లో ఒక సినిమాగా హాట్ స్ట్రీమ్‌గా భావిస్తాను. మీరు ఏ సమయంలో వచ్చారు, ఆ క్షణం నుండి మీరు చూడటం ప్రారంభించారు. నేను కోల్డ్ ఫ్లోను టెక్‌లోని కాల్‌తో పోలుస్తాను. మద్దతు. ఏ కాలర్ అయినా వాయిస్ మెయిల్ రికార్డింగ్‌ను ప్రారంభం నుండి చివరి వరకు వింటారు, కానీ మీరు అన్‌సబ్‌స్క్రైబ్‌ని ఉపయోగించి హ్యాంగ్ అప్ చేయవచ్చు.

వెచ్చని ప్రవాహాలు అని పిలవబడేవి కూడా ఉన్నాయని నేను గమనించాలనుకుంటున్నాను (నేను ఈ నిర్వచనాన్ని చాలా అరుదుగా మరియు విదేశీ సమాజాలలో మాత్రమే చూశాను) - ఇది చల్లని ప్రవాహం నుండి వేడిగా మారే ప్రవాహం. ప్రశ్న తలెత్తుతుంది - ఎక్కడ ఉపయోగించాలి)) నేను అభ్యాసం నుండి ఒక ఉదాహరణ ఇస్తాను.

నేను కోణీయతో పని చేస్తున్నాను. అతను చురుకుగా rxjలను ఉపయోగిస్తాడు. సర్వర్‌కు డేటాను స్వీకరించడానికి, నేను కోల్డ్ థ్రెడ్‌ని ఆశిస్తున్నాను మరియు 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)

ఆపరేటర్లు - takeWhile

జావాస్క్రిప్ట్‌లో అసమకాలిక ప్రోగ్రామింగ్ (కాల్‌బ్యాక్, ప్రామిస్, 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

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)

మేము ఆపరేటర్లతో పూర్తి చేసాము. సబ్జెక్ట్‌కి వెళ్దాం.

గట్టిగా ఆలోచిస్తున్నాను

ఆపై నేను టీ తాగడానికి వెళ్ళాను. నేను ఈ ఉదాహరణలతో విసిగిపోయాను 😀

విషయం కుటుంబం

విషయ కుటుంబం వేడి ప్రవాహాలకు ప్రధాన ఉదాహరణ. ఈ తరగతులు ఒక రకమైన హైబ్రిడ్, ఇవి ఏకకాలంలో పరిశీలించదగినవి మరియు పరిశీలకుడిగా పనిచేస్తాయి. విషయం హాట్ థ్రెడ్ కాబట్టి, దాని నుండి చందాను తీసివేయడం అవసరం. మేము ప్రధాన పద్ధతుల గురించి మాట్లాడినట్లయితే, అవి:

  • తదుపరి - స్ట్రీమ్‌కు కొత్త డేటా బదిలీ
  • లోపం - లోపం మరియు థ్రెడ్ ముగింపు
  • పూర్తి - థ్రెడ్ పూర్తి
  • సభ్యత్వం పొందండి - స్ట్రీమ్‌కు సభ్యత్వం పొందండి
  • అన్సబ్స్క్రైబ్ - స్ట్రీమ్ నుండి అన్సబ్స్క్రయిబ్
  • పరిశీలించదగినదిగా - పరిశీలకుడిగా రూపాంతరం చెందుతుంది
  • toPromise - వాగ్దానంగా రూపాంతరం చెందుతుంది

4 5 రకాల సబ్జెక్టులు ఉన్నాయి.

గట్టిగా ఆలోచిస్తున్నాను

స్ట్రీమ్‌లో 4 మంది వ్యక్తులు మాట్లాడుతున్నారు, కానీ వారు మరొకరిని జోడించారు. వారు చెప్పినట్లు, జీవించండి మరియు నేర్చుకోండి.

సాధారణ విషయం new Subject()- విషయాల యొక్క సరళమైన రకం. పారామితులు లేకుండా సృష్టించబడింది. చందా తర్వాత మాత్రమే అందుకున్న విలువలను ప్రసారం చేస్తుంది.

బిహేవియర్ సబ్జెక్ట్ new BehaviorSubject( defaultData<T> ) - నా అభిప్రాయం ప్రకారం, అత్యంత సాధారణ రకం విషయం. ఇన్‌పుట్ డిఫాల్ట్ విలువను తీసుకుంటుంది. చందా చేస్తున్నప్పుడు ప్రసారం చేయబడిన చివరి సంచిక యొక్క డేటాను ఎల్లప్పుడూ సేవ్ చేస్తుంది. ఈ తరగతి ఉపయోగకరమైన విలువ పద్ధతిని కూడా కలిగి ఉంది, ఇది స్ట్రీమ్ యొక్క ప్రస్తుత విలువను అందిస్తుంది.

రీప్లే సబ్జెక్ట్ new ReplaySubject(bufferSize?: number, windowTime?: number) — ఇన్‌పుట్ ఐచ్ఛికంగా అది నిల్వ చేసే విలువల బఫర్ యొక్క పరిమాణాన్ని మొదటి వాదనగా తీసుకోవచ్చు మరియు రెండవది మనకు మార్పులు అవసరమయ్యే సమయాన్ని తీసుకోవచ్చు.

AsyncSubject new AsyncSubject() — సభ్యత్వం పొందినప్పుడు ఏమీ జరగదు మరియు విలువ పూర్తయిన తర్వాత మాత్రమే తిరిగి ఇవ్వబడుతుంది. స్ట్రీమ్ యొక్క చివరి విలువ మాత్రమే తిరిగి ఇవ్వబడుతుంది.

WebSocketSubject new WebSocketSubject(urlConfigOrSource: string | WebSocketSubjectConfig<T> | Observable<T>, destination?: Observer<T>) - డాక్యుమెంటేషన్ అతని గురించి నిశ్శబ్దంగా ఉంది మరియు నేను అతనిని మొదటిసారి చూస్తున్నాను. అతను ఏమి చేస్తున్నాడో ఎవరికైనా తెలిస్తే, దయచేసి వ్రాయండి మరియు మేము దానిని జోడిస్తాము.

ఫ్యూ. సరే, ఈ రోజు నేను మీకు చెప్పాలనుకున్న ప్రతిదాన్ని మేము కవర్ చేసాము. ఈ సమాచారం ఉపయోగకరంగా ఉందని నేను ఆశిస్తున్నాను. ఉపయోగకరమైన సమాచార ట్యాబ్‌లో మీరు సూచనల జాబితాను మీరే చదువుకోవచ్చు.

ఉపయోగపడిందా సమాచారం

మూలం: www.habr.com

ఒక వ్యాఖ్యను జోడించండి