ஜாவாஸ்கிரிப்டில் ஒத்திசைவற்ற நிரலாக்கம் (கால்பேக், பிராமிஸ், ஆர்எக்ஸ்ஜேக்கள்)

அனைவருக்கும் வணக்கம். Sergey Omelnitsky தொடர்பில் உள்ளார். சிறிது காலத்திற்கு முன்பு நான் எதிர்வினை நிரலாக்கத்தில் ஒரு ஸ்ட்ரீம் நடத்தினேன், அங்கு நான் ஜாவாஸ்கிரிப்ட்டில் ஒத்திசைவு பற்றி பேசினேன். இன்று நான் இந்த விஷயத்தைப் பற்றிய குறிப்புகளை எடுக்க விரும்புகிறேன்.

ஆனால் முக்கிய பொருளைத் தொடங்குவதற்கு முன், நாம் ஒரு அறிமுகக் குறிப்பை உருவாக்க வேண்டும். எனவே வரையறைகளுடன் ஆரம்பிக்கலாம்: அடுக்கு மற்றும் வரிசை என்றால் என்ன?

அடுக்கு ஒரு தொகுப்பாகும், அதன் கூறுகள் கடைசியாக, முதல்-வெளியே LIFO அடிப்படையில் பெறப்படுகின்றன

முறை ஒரு தொகுப்பாகும், அதன் கூறுகள் முதல்-இன், முதல்-அவுட் FIFO அடிப்படையில் பெறப்படுகின்றன

சரி, தொடர்வோம்.

ஜாவாஸ்கிரிப்ட் என்பது ஒற்றை-திரிக்கப்பட்ட நிரலாக்க மொழியாகும். இதன் அர்த்தம், ஒரே ஒரு த்ரெட் மட்டுமே உள்ளது. எனவே, ஜாவாஸ்கிரிப்ட் ஒரு நேரத்தில் ஒரு செயல்பாட்டை மட்டுமே செய்ய முடியும், மற்ற செயல்பாடுகள் அவை அழைக்கப்படும் வரை ஸ்டேக்கை ஆன் செய்யும்.

அழைப்பு அடுக்கு நாம் இருக்கும் நிரலில் உள்ள இடத்தைப் பற்றிய தகவல்களைப் பதிவு செய்யும் தரவுக் கட்டமைப்பாகும். நாம் ஒரு செயல்பாட்டிற்குள் சென்றால், அதன் நுழைவை அடுக்கின் மேல் பகுதிக்கு தள்ளுவோம். நாம் ஒரு செயல்பாட்டிலிருந்து திரும்பும்போது, ​​ஸ்டேக்கிலிருந்து மிக உயர்ந்த உறுப்பைப் பாப் செய்து, செயல்பாடு என்று அழைக்கப்படும் இடத்தில் மீண்டும் முடிவடையும். ஸ்டாக் செய்யக்கூடியது இதுதான். இப்போது மிகவும் சுவாரஸ்யமான கேள்வி. ஜாவாஸ்கிரிப்ட்டில் ஒத்திசைவு எவ்வாறு செயல்படுகிறது?

உண்மையில், அடுக்குக்கு கூடுதலாக, உலாவிகள் 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() {… }) கட்டளை செயல்படுத்தப்படுகிறது. இணைய API இன் ஒரு பகுதியாக இருக்கும் டைமரை உலாவி உருவாக்குகிறது. இது ஒரு கவுண்டவுன் செய்யும்.

7) setTimeout(function cb1() {... }) கட்டளை அதன் வேலையை முடித்து, அழைப்பு அடுக்கில் இருந்து அகற்றப்பட்டது.

8) console.log('Bye') கட்டளை அழைப்பு அடுக்கில் சேர்க்கப்பட்டது.

9) console.log('Bye') கட்டளை செயல்படுத்தப்படுகிறது.

10) console.log('Bye') கட்டளையானது அழைப்பு அடுக்கிலிருந்து அகற்றப்பட்டது.

11) குறைந்தபட்சம் 5000 ms கடந்த பிறகு, டைமர் முடிவடைகிறது மற்றும் கால்பேக் வரிசையில் 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);
                    })
                })
            })
        })
    })
});

ஜாவாஸ்கிரிப்ட்டில் நமக்குத் தெரிந்த ஒத்திசைவற்ற நிரலாக்கமானது செயல்பாடுகளால் மட்டுமே செயல்படுத்தப்படும். மற்ற செயல்பாடுகளுக்கு மற்ற மாறிகளைப் போலவே அவை அனுப்பப்படலாம். இப்படித்தான் கால்பேக்குகள் பிறந்தன. அது சோகம், மனச்சோர்வு மற்றும் சோகமாக மாறும் வரை அது குளிர்ச்சியாகவும், வேடிக்கையாகவும், விளையாட்டுத்தனமாகவும் இருக்கும். ஏன்? இது எளிமை:

• குறியீட்டின் சிக்கலானது அதிகரிக்கும் போது, ​​திட்டம் விரைவில் தெளிவற்ற, மீண்டும் மீண்டும் உள்ளமைக்கப்பட்ட தொகுதிகளாக மாறும் - "கால்பேக் ஹெல்".
• பிழை கையாளுதல் தவறவிடுவது எளிது.
• நீங்கள் வெளிப்பாடுகளை திரும்பப் பெற முடியாது.

ப்ராமிஸின் வருகையால், நிலைமை கொஞ்சம் நன்றாக மாறியது.

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 ஐப் பயன்படுத்தி இணையான செயல்பாட்டின் சாத்தியத்தை சேர்த்தது
• ஒத்திசைவு/காத்திருப்பைப் பயன்படுத்தி உள்ளமை ஒத்திசைவை நாம் தீர்க்கலாம்

ஆனால் வாக்குறுதிகளுக்கு அவற்றின் வரம்புகள் உள்ளன. எடுத்துக்காட்டாக, ஒரு டம்போரைனுடன் நடனமாடாமல் ஒரு வாக்குறுதியை ரத்து செய்ய முடியாது, மிக முக்கியமாக, அது ஒரு மதிப்புடன் செயல்படுகிறது.

சரி, நாங்கள் எதிர்வினை நிரலாக்கத்தை சுமுகமாக அணுகியுள்ளோம். சோர்வாக? சரி, நல்லவேளையாக, நீங்கள் கொஞ்சம் தேநீர் தயாரித்துவிட்டு, அதைப் பற்றி யோசித்துவிட்டு மேலும் படிக்க வரலாம். மேலும் தொடர்வேன்.

எதிர்வினை நிரலாக்கம் தரவு ஓட்டங்கள் மற்றும் மாற்றப் பரப்புதல் ஆகியவற்றில் கவனம் செலுத்தும் ஒரு நிரலாக்க முன்னுதாரணமாகும். டேட்டா ஸ்ட்ரீம் என்றால் என்ன என்பதை இன்னும் விரிவாகப் பார்ப்போம்.

// Получаем ссылку на элемент
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 செயல்படுத்தலின் முக்கிய பகுதி உள்ளது. இது ஒரு காணக்கூடிய ஸ்ட்ரீமுடன் தொடர்புடையது, இது சந்தா முறையைப் பயன்படுத்தி குழுசேர முடியும்.

கவனிக்கத்தக்கது புதுப்பிப்புகளை உருவாக்குவதற்கான உதவி பொறிமுறையை செயல்படுத்துகிறது, என்று அழைக்கப்படும் அப்சர்வர். பார்வையாளருக்கான மதிப்புகளின் ஆதாரம் அழைக்கப்படுகிறது தயாரிப்பாளர். இது ஒரு வரிசை, இட்டேட்டர், வெப் சாக்கெட், சில வகையான நிகழ்வு போன்றவையாக இருக்கலாம். எனவே நாம் கவனிக்கக்கூடியது தயாரிப்பாளருக்கும் பார்வையாளருக்கும் இடையே ஒரு கடத்தி என்று சொல்லலாம்.

கவனிக்கக்கூடியது மூன்று வகையான பார்வையாளர் நிகழ்வுகளைக் கையாளுகிறது:

• அடுத்தது - புதிய தரவு
• பிழை - விதிவிலக்கு காரணமாக வரிசை முடிந்தால் பிழை. இந்த நிகழ்வு வரிசையின் நிறைவையும் குறிக்கிறது.
• முழுமையான - வரிசையின் நிறைவு பற்றிய சமிக்ஞை. இதன் பொருள் இனி புதிய தரவு இருக்காது.

டெமோவைப் பார்ப்போம்:

தொடக்கத்தில் 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 ஆபரேட்டர் ஓரளவு வாக்குறுதியை ஒத்திருக்கிறது. இது பல நூல்களை ஒன்றாக இணைக்கிறது. ஒவ்வொரு நூலும் குறைந்தது ஒரு உமிழ்வைச் செய்த பிறகு, ஒவ்வொன்றிலிருந்தும் சமீபத்திய மதிப்புகளை வரிசையின் வடிவத்தில் பெறுகிறோம். மேலும், இணைக்கப்பட்ட ஸ்ட்ரீம்களில் இருந்து ஏதேனும் உமிழ்வு ஏற்பட்ட பிறகு, அது புதிய மதிப்புகளைக் கொடுக்கும்.

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

ஜிப் - ஒவ்வொரு தொடரிலிருந்தும் ஒரு மதிப்புக்காக காத்திருக்கிறது மற்றும் இந்த மதிப்புகளின் அடிப்படையில் ஒரு வரிசையை உருவாக்குகிறது. எந்த நூலிலிருந்தும் மதிப்பு வரவில்லை என்றால், குழு உருவாகாது.

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)
);

ஆபரேட்டர்கள் - பகிர், தட்டவும்

டேப் ஆபரேட்டர் பக்க விளைவுகளைச் செய்ய உங்களை அனுமதிக்கிறது, அதாவது, வரிசையை பாதிக்காத எந்த செயல்களும்.

ஷேர் யூட்டிலிட்டி ஆபரேட்டர் குளிர் ஸ்ட்ரீமை ஹாட் ஸ்ட்ரீமாக மாற்ற முடியும்.

நாங்கள் ஆபரேட்டர்களை முடித்துவிட்டோம். பாடத்திற்கு செல்வோம்.

உரத்த சிந்தனை

பிறகு தேநீர் அருந்தச் சென்றேன். இந்த எடுத்துக்காட்டுகளால் நான் சோர்வாக இருக்கிறேன் 😀

பொருள் குடும்பம்

பொருள் குடும்பம் சூடான ஓட்டங்களுக்கு ஒரு முக்கிய எடுத்துக்காட்டு. இந்த வகுப்புகள் ஒரு வகையான கலப்பினமாகும், அவை ஒரே நேரத்தில் கவனிக்கக்கூடிய மற்றும் பார்வையாளராக செயல்படுகின்றன. சப்ஜெக்ட் ஹாட் த்ரெட் என்பதால், அதிலிருந்து குழுவிலக வேண்டியது அவசியம். முக்கிய முறைகளைப் பற்றி நாம் பேசினால், இவை:

• அடுத்தது - ஸ்ட்ரீமுக்கு புதிய தரவை மாற்றுதல்
• பிழை - பிழை மற்றும் நூல் முடித்தல்
• முழுமை - நூலின் நிறைவு
• குழுசேர் - ஒரு ஸ்ட்ரீமுக்கு குழுசேரவும்
• குழுவிலக - ஸ்ட்ரீமில் இருந்து குழுவிலக
• கவனிக்கத்தக்கது - பார்வையாளராக மாறுதல்
• to Promise - ஒரு வாக்குறுதியாக மாற்றுகிறது

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>) - ஆவணங்கள் அவரைப் பற்றி அமைதியாக இருக்கின்றன, நான் அவரை முதல் முறையாகப் பார்க்கிறேன். அவர் என்ன செய்கிறார் என்று யாருக்காவது தெரிந்தால், எழுதுங்கள், நாங்கள் அதைச் சேர்ப்போம்.

ப்யூ. சரி, இன்று நான் உங்களுக்குச் சொல்ல விரும்பிய அனைத்தையும் உள்ளடக்கியுள்ளோம். இந்த தகவல் பயனுள்ளதாக இருந்தது என்று நம்புகிறேன். பயனுள்ள தகவல் தாவலில் குறிப்புகளின் பட்டியலை நீங்களே படிக்கலாம்.

பயனுள்ள தகவல்களை

• ஸ்ட்ரீமுக்கான இணைப்பு
• JS எவ்வாறு செயல்படுகிறது: இயந்திரத்தின் கண்ணோட்டம், இயக்க நேர வழிமுறைகள், அழைப்பு அடுக்கு
• JS எவ்வாறு செயல்படுகிறது: நிகழ்வு வளையம், ஒத்திசைவு மற்றும் உங்கள் குறியீட்டை ஒத்திசைவு/காத்திருப்புடன் மேம்படுத்த ஐந்து வழிகள்
• ஜாவாஸ்ரிப்டில் நிகழ்வு லூப் எவ்வாறு செயல்படுகிறது
• ஒத்திசைவற்ற ஜாவாஸ்கிரிப்ட்டின் பரிணாமம்
• RxJS என்றால் என்ன, அதைப் பற்றி தெரிந்து கொள்வது ஏன் பயனுள்ளது?
  
• RxJS இன் நடைமுறை பயன்பாடு
• RxJS கவனிக்கக்கூடியது பயிற்சி — அவதானிக்கக்கூடியவற்றை உருவாக்குதல் மற்றும் சந்தா செலுத்துதல்
• RXJS: சூடான மற்றும் குளிர்ச்சியான அவதானிப்புகள்
• வகுப்புகள், கவனிக்கக்கூடியவற்றை உருவாக்குவதற்கான செயல்பாடுகள். ஆபரேட்டர்கள்.
• உதாரணமாக RxJS ஆபரேட்டர்கள்
• ஏபிஐ பட்டியல்
• RxJS இல் உள்ள பொருள் மற்றும் அட்டவணைகளின் வகைகள்

ஆதாரம்: www.habr.com