JavaScript belgilar, atteratorlar, generatorlar, async / kutish va async-atteratorlar - barchasi sodda tarzda tushuntirilgan

Ba'zi JavaScript (ECMAScript) xususiyatlarini boshqalarga qaraganda tushunish osonroq. Jeneratörlar g'alati ko'rinadi - C / C ++ dagi ko'rsatgichlar kabi. Belgilar bir vaqtning o'zida ham ibtidoiy, ham ob'ekt kabi ko'rinishga ega.

Ushbu xususiyatlar barchasi bir-biriga bog'liq va bir-biriga asoslangan. Shunday qilib, siz boshqasini tushunmasdan bir narsani tushuna olmaysiz.

Shunday qilib, ushbu maqolada men ramzlar, global belgilar, iteratorlar, iterables, generatorlar, async / kutish va async iteratorlarini qamrab olaman. Avvaliga "nima uchun" ular borligini va qanday foydali misollar bilan ishlashlarini ko'rsatib beraman.

Bu nisbatan ilg'or mavzu, ammo bu raketalar haqidagi fan emas. Ushbu maqola ushbu tushunchalarning barchasini yaxshi tushunishga imkon beradi.

OK, boshlaymiz

Belgilar

ES2015-da yangi (6-chi) ma'lumotlar deb nomlangan ma'lumotlar turi yaratildi.

NEGA?

Uch asosiy sabab:

1-sabab - Oldinga mos keladigan yangi asosiy xususiyatlarni qo'shing

JavaScript ishlab chiquvchilari va ECMAScript qo'mitasi (TC39) yangi obzor xususiyatlarini qo'shish uchun mavjud usullarni, masalan, ko'chadan yokiObject.keys singari JavaScript usullarini buzmasdan qo'shish kerak edi.

Masalan, agar menda ob'ekt bo'lsa, var myObject = {firstName: 'raja', lastName: 'rao'} va agar men runObject.keys (myObject) bo'lsa, u [firstName, lastName] ga qaytadi.

Endi, agar biz boshqa xususiyat qo'shsak, myObject-ga newProperty deb ayting va agar siz Object.keys (myObject) dasturini ishlatsangiz, u eski qiymatlarni qaytarishi kerak (ya'ni yangi qo'shilgan yangi properatni e'tiborsiz qoldiradi) va shunchaki [firstName, lastName] ni namoyish etadi. - va emas [first name, familiya, newProperty]. Buni qanday qilish kerak?

Biz buni ilgari qila olmasdik, shuning uchun yangi belgilar turi yaratildi.

Agar siz NewProperty-ni ramz sifatida qo'shsangiz, unda Object.keys (myObject) bunga e'tibor bermaydi (chunki u bu haqda bilmaydi) va yana [firstName, lastName] ni qaytaradi!

Sabab №2 - Ismlar to'qnashuvidan saqlaning

Ular, shuningdek, ushbu xususiyatlarni noyob saqlashni xohlashdi. Shunday qilib, ular nomlarning to'qnashuvi haqida qayg'urmasdan global xususiyatlarga yangi ob'ektlar qo'shishni davom ettirishlari mumkin (va siz ob'ekt xususiyatlarini qo'shishingiz mumkin).

Masalan, global Array.prototype-gaUpperCase-ga maxsus qo'shadigan ob'ektingiz bor deb ayting.

Endi boshqa bir kutubxonani yuklaganingizni tasavvur qiling (yoki ES2019 chiqdi) va u Array.prototype.toUpperCase-ning boshqa versiyasiga ega edi. Nomlarning to'qnashuvi tufayli sizning funktsiyangiz buzilishi mumkin.

Shunday qilib, siz bu nom bilan to'qnashuvni qanday hal qilasiz? Belgilar shu erda keladi. Ular ichkarida noyob qadriyatlarni yaratadilar, ular sizga nomlarning to'qnashuvi haqida tashvishlanmasdan qo'shimcha xususiyatlar yaratishga imkon beradi.

3-sonli sabab - "Taniqli" belgilar orqali asosiy usullarga bog'lanish

Aytaylik, sizga biron bir asosiy funktsiyani, masalan, sayString.prototype.search shaxsiy funktsiyangizni chaqirish kerak. Ya'ni "qidirmoq" qidiruvi (myObject); myObject qidirish funktsiyasini chaqirib, parametr sifatida "boshqa usulni" o'tishi kerak! Buni qanday qilishimiz kerak?

Bu erda ES2015 "taniqli" ramzlar deb nomlangan global ramzlar to'plamini ishlab chiqdi. Sizning ob'yektingizda mulk sifatida ushbu belgilarning bittasi bo'lsa, funktsiyani chaqirish uchun asosiy funktsiyalarni qayta yo'naltirishingiz mumkin!

Hozir bu haqda ko'p gaplasha olmaymiz, shu sababli ushbu maqolada biroz keyinroq barcha tafsilotlarni bilib olaman. Avvalo, ramzlar aslida qanday ishlashini bilib olaylik.

Belgilar yaratish

Symbol deb nomlangan global funktsiyani / ob'ektni chaqirib siz belgi yaratishingiz mumkin. Ushbu funktsiya ma'lumotlar turi belgilarining qiymatini qaytaradi.

Izoh: Belgilar Ob'ektlar kabi ko'rinishi mumkin, chunki ularning usullari bor, lekin ular yo'q - ular ibtidoiy. Siz ularni "maxsus" ob'ektlar deb hisoblashingiz mumkin, ular odatiy narsalarga o'xshashliklarga ega, ammo ular oddiy ob'ektlarga o'xshamaydi.

Masalan: Belgilarda xuddi Ob'ektlar kabi usullar mavjud, ammo ob'ektlardan farqli o'laroq ular o'zgarmas va noyobdir.

Belgilarni "yangi" kalit so'z bilan yaratib bo'lmaydi

Belgilar ob'ekt emasligi va yangi kalit so'z ob'ektni qaytarishi kerakligi sababli, biz belgilar turini qaytarish uchun yangi foydalana olmaymiz.

var mySymbol = yangi Symbol (); // xato tashlaydi

Belgilar "tavsif" ga ega

Belgilar tavsifiga ega bo'lishi mumkin - bu faqat jurnallarni yozishda ishlatiladi.

// mySymbol o'zgaruvchisi endi "ramz" noyob qiymatiga ega
// uning tavsifi "ba'zi matnlar"
const mySymbol = Symbol ('ba'zi matn');

Belgilar noyobdir

const mySymbol1 = Symbol ('ba'zi matn');
const mySymbol2 = Symbol ('ba'zi matn');
mySymbol1 == mySymbol2 // noto'g'ri

Agar biz "Symbol.for" usulidan foydalansak, simvollar singlton kabi ishlaydi

Symbol () orqali simvol yaratishning o'rniga, uni Symbol.for () orqali yaratishingiz mumkin. Belgini yaratish uchun "kalit" (satr) kerak bo'ladi. Va agar ushbu kalitli belgi allaqachon mavjud bo'lsa, u shunchaki eski belgini qaytaradi! Shunday qilib, biz Symbol.for usulidan foydalansak, u singlton kabi ishlaydi.

var mySymbol1 = Symbol.for ('ba'zi bir kalit'); // yangi belgi yaratadi
var mySymbol2 = Symbol.for ('ba'zi bir kalit'); // ** bir xil belgini qaytaradi
mySymbol1 == mySymbol2 // rost

.For-dan foydalanishning haqiqiy sababi bu bir joyda Symbol yaratish va boshqa joyda bir xil Symbol-ga kirishdir.

Diqqat: Symbol.for belgisi noyob holga keltiradi, shunda agar kalitlar bir xil bo'lsa, siz qiymatlarni bekor qilasiz! Agar iloji bo'lsa, buning oldini olishga harakat qiling!

Belgining "tavsifi" "kalit" ga nisbatan

Aniqroq qilish uchun, agar siz Symbol.for-dan foydalanmasangiz, unda belgilar noyobdir. Ammo, agar siz undan foydalansangiz, unda sizning kalitingiz noyob bo'lmasa, qaytarilgan belgilar ham noyob bo'lmaydi.

Belgilar ob'ekt mulki kaliti bo'lishi mumkin

Bu ramzlar haqida juda noyob narsa - va eng chalkashligi. Ular ob'ekt kabi ko'rinsa ham, ular ibtidoiy. Va biz ob'ektga ramzni String kabi xususiyat tugmachasi sifatida biriktirishimiz mumkin.

Aslida, bu belgilardan foydalanishning asosiy usullaridan biri - ob'ekt xususiyatlari sifatida!

Izoh: Belgilar bo'lgan ob'ekt xususiyatlari "kalitli xususiyatlar" deb nomlanadi.

Qavslar operatori va nuqta operatori

Nuqta operatoridan foydalana olmaysiz, chunki nuqta operatorlari faqat satr xususiyatlarida ishlaydi, shuning uchun siz qavs operatoridan foydalanishingiz kerak.

Ramzlardan foydalanishning 3 asosiy sababi - sharh

Endi biz ramzlar qanday ishlashini bilganimizning uchta asosiy sababini ko'rib chiqaylik.

1-sabab - ramzlar ko'chadan va boshqa usullarda ko'rinmaydi

Quyidagi misoldagi in-in loop obj ob'ekti ustidan aylanadi, lekin u prop3 va prop4 ni bilmaydi (yoki e'tiborsiz qoldiradi), chunki ular simvollardir.

Quyida Object.keys va Object.getOwnPropertyNames belgilar belgilariga e'tibor bermaydigan boshqa bir misol keltirilgan.

Sabab №2 - ramzlar noyobdir

Aytaylik, sizga Array.prototype.inclain deb nomlangan xususiyat kerak bo'lib, global Array ob'ekti tarkibiga kiradi. Bu standart (ES2018) javadan tashqari bo'lgan usulni o'z ichiga olgan usul bilan to'qnashadi. Uni to'qnashmasdan qanday qo'shasiz?

Birinchidan, tegishli nomi bo'lgan o'zgaruvchini yarating va unga belgi qo'ying. Keyin ushbu o'zgaruvchini (hozirda ramz), qavsli yozuv yordamida global Array-ga qo'shing. Istagan funktsiyani tayinlang.

Va nihoyat ushbu funktsiyani qavs notasi yordamida chaqiring. Shunga e'tibor beringki, qavs ichida haqiqiy belgini o'tish kerak: arr [include] (), lekin satr sifatida emas.

3-sabab. Taniqli belgilar (ya'ni "global" belgilar)

Odatiy bo'lib, JavaScript avtomatik ravishda o'zgarmaydigan o'zgaruvchilar to'plamini yaratadi va ularni global Symbol ob'ektiga tayinlaydi (ha, biz simvol yaratish uchun foydalanadigan xuddi shu Symbol ()).

ECMAScript 2015-da, bu belgilar keyinchalik String.prototype.search va String.prototype.replace kabi asosiy usullarga qo'shiladi, masalan, massivlar va satrlar.

Ushbu belgilarga ba'zi misollar: Symbol.match, Symbol.replace, Symbol.search, Symbol.iterator va Symbol.split.

Ushbu global ramzlar global ahamiyatga ega bo'lganligi sababli, biz asosiy usullarni ichki funktsiyalarga emas, balki shaxsiy funktsiyalarimizga chaqiramiz.

Misol: Symbol.search

Masalan, String ob'ektining String.prototype.search umumiy usuli regExp yoki satrni qidiradi va agar topilsa indeksni qaytaradi.

ES2015-da birinchi navbatda SymE.search usuli regExp so'rovida (RegExp ob'ekti) bajarilganligini tekshiradi. Agar shunday bo'lsa, u bu funktsiyani chaqiradi va ishni unga topshiradi. Va RegExp kabi yadro-ob'ektlar Symbol.search belgisini amalda bajaradi.

Symbol.search ichki ishlanmalari (DEFAULT BEHAVIOR)

  1. "Rajarao" qidiruvini tahlil qiling ('rao');
  2. "Rajarao" ni String Object yangi stringiga ("rajarao") aylantirish
  3. "Reox" ni yangi Regexp ob'ektiga ("rao") aylantirish
  4. "Rajarao" String ob'ektini qo'ng'iroq qilish usuli.
  5. qidiruv usuli Symbol.search metodini "rao" ob'ekti ichidan chaqiradi (qidiruvni "rao" ob'ektiga qaytaradi) va "raxarao" ni o'tkazadi. Bunga o'xshash narsa: "rao" [Symbol.search] ("rajarao")
  6. "rao" [Symbol.search] ("rajarao") indeks natijasini 4 ta qidirish funktsiyasi sifatida qaytaradi va nihoyat, qidiruv 4-ni kodimizga qaytaradi.

Quyidagi soxta kod parchasi kodning ichki ishlashini ko'rsatadi:

Ammo go'zallik shundaki, endi siz RegExp-dan o'tishingiz shart emas. Siz Symbol.search-ni amalga oshiradigan istalgan maxsus ob'ektni topshirishingiz va istaganingizni qaytarishingiz mumkin va bu ishlashni davom ettiradi.

Keling, ko'rib chiqamiz.

Funktsiyamizni chaqirish uchun String.search usulini sozlash

Quyidagi misol Symbol.search global Symbol tufayli String.prototype.search-ni bizning Mahsulot sinfimizning qidiruv funktsiyasi deb atashimiz mumkinligini ko'rsatadi.

Symbol.search ichki ishlanmalari (BUYuRChI BEHAVIOR)

  1. "Barsoap" qidiruvini tahlil qiling (soapObj);
  2. "Barsoap" ni String Object yangi stringiga aylantirish ("barsoap")
  3. SoapObj allaqachon ob'ekt bo'lganligi sababli, hech qanday konversiya qilmang
  4. "Barsoap" String ob'ektini qidirish usuli.
  5. qidiruv usuli Symbol.search metodini "soapObj" ob'ekti ichidan chaqiradi (ya'ni qidiruvni "soapObj" ob'ektiga qaytaradi) va "barsoap" ni beradi. Bunga o'xshash narsa: soapObj [Symbol.search] ("barsoap")
  6. soapObj [Symbol.search] ("barsoap") indeks natijasini qidiruv funktsiyasiga FOUND sifatida qaytaradi va nihoyat qidirish FOUNDni kodimizga qaytaradi.

Umid qilamanki, hozirda siz ramzlarni yaxshi tushunasiz.

OK, Iteratorlarga o'taylik.

Iteratorlar va atamalar

NEGA?

Deyarli barcha ilovalarimizda biz doimiy ravishda ma'lumotlar ro'yxati bilan shug'ullanamiz va bu ma'lumotlarni brauzerda yoki mobil ilovada aks ettirishimiz kerak. Odatda biz ushbu ma'lumotlarni saqlash va olish uchun o'z usullarimizni yozamiz.

Ammo gap shundaki, bizda massivlar, satrlar va xaritalar kabi standart ob'ektlardan ma'lumotlar to'plamlarini olish uchun for-of-loop va spread operatori (...) kabi standart usullar mavjud. Nega biz ushbu standart usullarni bizning ob'ektimiz uchun ham ishlata olmaymiz?

Quyidagi misolda biz foydalanuvchilar sinfidan ma'lumotlarni olish uchun for-loop yoki spread operatoridan foydalana olmaymiz. Biz odatdagi olish usulidan foydalanishimiz kerak.

Ammo mavjud usullarni o'z ob'ektlarimizda qo'llasa yaxshi bo'lmaydimi? Bunga erishish uchun biz barcha ishlab chiquvchilar kuzatishi va o'zlarining ob'ektlarini mavjud usullar bilan ishlashi uchun qilishi kerak bo'lgan qoidalarga ega bo'lishimiz kerak.

Agar ular ob'ektlardan ma'lumot olish uchun ushbu qoidalarga rioya qilsalar, bunday ob'ektlar "iterable" deb nomlanadi.

Qoidalar:

  1. Asosiy ob'ekt / sinf ba'zi ma'lumotlarni saqlashi kerak.
  2. Asosiy ob'ekt / sinf № 3 dan 6gacha qoidalarga muvofiq ma'lum bir usulni amalga oshiradigan global xususiyatga ega bo'lgan "taniqli" ramziy simulyator.iteratorga ega bo'lishi kerak.
  3. Ushbu symbol.iterator usuli boshqa ob'ektni - "iterator" ob'ektini qaytarishi kerak.
  4. Ushbu "iterator" ob'ektda keyingi usul deb nomlangan usul bo'lishi kerak.
  5. Keyingi usul №1 qoidada saqlangan ma'lumotlarga kirish huquqiga ega bo'lishi kerak.
  6. Agar biz iteratorObj.next () deb nomlasak, u # 1 qoidadan ba'zi saqlangan ma'lumotlarni {qiymati: , bajarilgan: noto'g'ri} format sifatida, agar u qo'shimcha qiymatlarni qaytarishni xohlasa yoki {bajarilgan: haqiqiy} kabi qaytarishi kerak. agar u boshqa ma'lumotlarni qaytarishni xohlamasa.

Agar ushbu 6 ta qoidaga rioya qilinsa, unda asosiy ob'ekt 1-qoidadan "iterable" deb nomlanadi. Qaytarilgan ob'ekt "iterator" deb nomlanadi.

Qanday qilib bizning foydalanuvchilarimizni qanday ob'yektiv va o'zgartira oladigan qilib ko'rib chiqamiz:

Kattalashtirish uchun bosing

Muhim eslatma: Agar biz aylantiruvchi (allUsers) for of loop yoki spread operatoriga o'tadigan bo'lsak, iteratorni olish uchun (allUsersIterator kabi) iteratorni ishlatib, [Symbol.iterator] () deb chaqiramiz va keyin ma'lumotlarni olish uchun iteratordan foydalanamiz.

Shunday qilib, barcha qoidalar iterator ob'ektini qaytarishning standart usuliga ega bo'lishi kerak.

Jenerator funktsiyalari

NEGA?

Ikkita asosiy sabab bor:

  1. iterable uchun yuqori darajadagi mavhumlikni ta'minlang
  2. "Callback-hell" kabi narsalarga yordam berish uchun yangi boshqaruv oqimini ta'minlang.

Ularni batafsil ko'rib chiqaylik.

1-MAVZU - Iterabl uchun o'rash

Bu qoidalarga amal qilish orqali bizning sinfimiz / ob'ekti iterativ qilishning o'rniga, biz narsalarni soddalashtirish uchun "Generator" usuli deb ataladigan narsani yaratamiz.

Quyida generatorlar bilan bog'liq asosiy fikrlar keltirilgan:

  1. Generator usullari sinf ichida yangi * sintaksisiga ega va Generator funktsiyalari * myGenerator () {} sintaksisiga ega.
  2. MyGenerator () generatorlarini chaqirish generator iterator protokolini (qoidalarini) amalga oshiradigan generator ob'ektini qaytaradi, shuning uchun biz uni iteratordan orqaga qaytarish qiymati sifatida foydalanishimiz mumkin.
  3. Ma'lumotni qaytarish uchun generatorlar maxsus hosil to'g'risida ma'lumotlardan foydalanadilar.
  4. rentabellik bayonnomasi oldingi qo'ng'iroqlarni kuzatib boradi va qolgan joydan davom etadi.
  5. Agar tsikl ichidagi hosildan foydalansangiz, iteratorda keyingi () usulni har safar chaqirganimizda, bu faqat bir marta bajariladi.

1-misol:

Quyidagi kod Symbol.iterator usulidan foydalanish va barcha qoidalarga rioya qilgan holda keyingi usulni amalga oshirish o'rniga generator usulidan (* getIterator ()) foydalanishingiz mumkinligini ko'rsatadi.

Sinf ichidagi generatorlardan foydalanish

2-misol:

Buni yanada soddalashtirishingiz mumkin. Funktsiyani generator qiling (* sintaksisi bilan) va quyida ko'rsatilgandek qiymatlarni birma-bir qaytarish uchun hosiladan foydalaning.

Jeneratorlarni bevosita vazifalar sifatida ishlatish

Muhim eslatma: Yuqoridagi misollarda men allerlarni ifodalash uchun "iterator" so'zini ishlataman, bu aslida generator ob'ekti.

Jeneratör ob'ektida keyingi usulga qo'shimcha ravishda otish va qaytarish kabi usullar mavjud! Ammo amaliy maqsadlar uchun biz qaytarilgan ob'ektni "iterator" sifatida ishlatishimiz mumkin.

2-MAQSAD - Yaxshi va yangi boshqaruv oqimlarini ta'minlang

Bizga dasturlarni yangi usulda yozishga va "qayta qo'ng'iroq jahannam" kabi muammolarni hal qilishga yordam beradigan yangi boshqaruv oqimlarini taqdim etishga yordam bering.

E'tibor bering, normal funktsiyadan farqli o'laroq, generator funktsiyasi hosil qilishi mumkin (funktsiyaning holati va qaytarilish qiymatini saqlaydi), shuningdek, u berilgan nuqtada qo'shimcha kirish qiymatlarini olishga tayyor.

Quyidagi rasmda har safar hosilni ko'rganda, u qiymatni qaytarishi mumkin. Siz generator.next-dan foydalanishingiz mumkin ("yangi qiymat") va yangi qiymatni u berilgan joyga berishingiz mumkin.

Normal funktsiya vs generator funktsiyasi

Quyidagi misol boshqaruv oqimi qanday ishlashini aniqroq ko'rsatib beradi:

Jeneratör nazorat oqimi

Generator sintaksisi va ishlatilishi

Jenerator funktsiyalaridan quyidagi yo'llar bilan foydalanish mumkin:

Biz "hosil" dan keyin ko'proq kodga ega bo'lishimiz mumkin ("qaytish" bayonotidan farqli o'laroq)

Qaytish kalit so'zi singari, hosil beradigan kalit so'z ham qiymatni qaytaradi - ammo bu bizga berilganidan keyin kodga ega bo'lishimizga imkon beradi!

Siz bir nechta hosil olishingiz mumkin

Siz bir necha bor natijalar to'g'risida ma'lumot olishingiz mumkin

"Keyingi" usuli orqali oldinga va orqaga qarab qiymatlarni generatorga yuborish

Keyingi usul iteratorlar, quyida ko'rsatilgandek, qiymatlarni generatorga qaytarishi mumkin.

Aslida, bu xususiyat generatorlarga "qayta qo'ng'iroq jahannamini" yo'q qilishga imkon beradi. Birozdan keyin bu haqida ko'proq ma'lumotga ega bo'lasiz.

Ushbu xususiyat, shuningdek, redux-saga kabi kutubxonalarda keng qo'llaniladi.

Quyidagi misolda savolni olish uchun iteratorni bo'sh keyingi () chaqiruvi bilan chaqiramiz. Va keyin, keyingi (23) ni ikkinchi marta chaqirganda, biz 23 qiymat sifatida o'tamiz.

Jeneratorga tashqi qiymatni

Generatorlar "qayta qo'ng'iroq jahannamini" yo'q qilishga yordam beradi

Bilasizmi, agar bizda bir nechta asinxron qo'ng'iroqlar bo'lsa, biz qayta qo'ng'iroq jahannamiga tushamiz.

Quyidagi misolda "co" kabi kutubxonalar async kodini sinxron yozishda yordam beradigan keyingi usul orqali qiymatni o'tkazishga imkon beruvchi generator xususiyatidan qanday foydalanishini ko'rsatib beradi.

Co funktsiyasi va'dadan olingan natijani generatorga keyingi 5-bosqich va № 10-qadamda (natija) qanday o'tishiga e'tibor bering.

)" dan foydalanadigan "co" kabi liblarni bosqichma-bosqich izohlash" src="https://imgstore.nyc3.cdn.digitaloceanspaces.com/hot-p/1573704681166.png" />

OK, async / kutishga o'taylik.

ASYNC / AVAIT

NEGA?

Yuqorida ko'rganingizdek, generatorlar "qayta qo'ng'iroq jahannamini" yo'q qilishga yordam berishi mumkin, ammo buni amalga oshirish uchun sizga shu kabi uchinchi tomon kutubxonasi kerak bo'ladi. Ammo "qayta chaqirish jahannam" bu juda katta muammo, ECMAScript qo'mitasi faqat Generatorning shu jihati uchun o'rash vositasini yaratishga qaror qildi va async /ait yangi kalit so'zlari bilan chiqdi.

Generatorlar va Async / Await o'rtasidagi farqlar quyidagicha:

  1. asink / kutish hosildorlik o'rniga kutishni qo'llaydi
  2. faqat va'dalar bilan ishlashni kuting.
  3. * Funktsiyasi o'rniga async funktsiyasi kalit so'zidan foydalanadi.

Shunday qilib, async /ait kutish asosan Generatorlarning to'plami bo'lib, yangi sintaktik shakarga ega.

Async kalit so'zi JavaScript kompilyatoriga funktsiyaga boshqacha munosabatda bo'lish kerakligini aytadi. Tuzuvchi ushbu funktsiya ichidagi kutish kalit so'ziga yetganda to'xtaydi. Bu kutgandan keyingi ibora va'dani qaytaradi va oldinga siljishdan oldin va'da berilguncha yoki rad etilguncha kutadi deb taxmin qiladi.

Quyidagi misolda getAmount funktsiyasi ikkita asenkron funktsiyani getUser va getBankBalance deb ataydi. Biz buni va'da bilan amalga oshirishimiz mumkin, ammo async kutish yanada oqlangan va sodda.

ASYNC ITERATORLAR

NEGA?

Bu juda tez-tez uchraydigan stsenariy, biz async funktsiyasini pastadir deb atashimiz kerak. Shunday qilib, ES2018-da (tugallangan taklif) TC39 qo'mitasi yangi Symbol.asyncIterator va shuningdek, asinx funktsiyalarini osongina aylanib o'tishga yordam beradigan yangi dasturni taklif qildi.

Oddiy Iterator ob'ektlari va Async Iteratorlari o'rtasidagi asosiy farq quyidagicha:

Iterator ob'ekti

  1. Iterator ob'ektining keyingi () usuli {value: 'some val' kabi qiymatni qaytaradi, bajarilgan: false}
  2. Foydalanish: iterator.next () // {qiymat: 'ba'zi val', bajarilgan: noto'g'ri}

Async Iterator ob'ekti

  1. Async Iterator ob'ektining navbatdagi () usuli keyinchalik {qiymati: 'some val', bajarilgan: false} kabi hal qilinadigan va'da beradi.
  2. Foydalanish: iterator.next (). Keyin (({value, amalga oshirilgan)) => {// {qiymat: 'ba'zi val', bajarilgan: noto'g'ri}}

Quyidagi misolda kutish uchun qilingan ishlar va undan qanday foydalanishingiz mumkinligi ko'rsatilgan.

kutish (ES2018)

Xulosa

Belgilar - ma'lumotlarning global noyob turini ta'minlaydi. Siz ularni asosan ob'ektlar xususiyatlari sifatida yangi xatti-harakatlar qo'shish uchun ishlatasiz, shunda siz Object.keys va in-in loop kabi standart usullarni buzmaysiz.

Taniqli belgilar - bu JavaScript tomonidan avtomatik yaratilgan ramzlar bo'lib, ulardan maxsus ob'ektlarda asosiy usullarni amalga oshirish uchun foydalanish mumkin

Iterables - bu ma'lumotlar to'plamini saqlaydigan va muayyan qoidalarga amal qiladigan har qanday ob'ekt bo'lib, biz standart ko'chadan va ... tarqalish operatorlaridan ulardan ma'lumotlarni olish uchun foydalanishimiz mumkin.

Iteratörler - Iterables tomonidan qaytariladi va keyingi usulga ega - bu aslida ma'lumotni iterable dan chiqarib oladigan narsa.

Jeneratörlar - Iterable-ga yuqori darajadagi mavhumlikni taqdim etish. Shuningdek, ular "callback-hell" kabi muammolarni hal qiladigan va Async / Await kabi narsalar uchun qurilish bloklarini ta'minlaydigan yangi boshqaruv oqimlarini ta'minlaydi.

Async / Await - chaqirish-do'zax muammosini maxsus ravishda hal qilish uchun generatorlarga yuqori darajadagi mavhumlikni ta'minlaydi.

Async Iterators - odatiy pastadir singari har bir async funktsiyasining natijasini olish uchun async funktsiyalarining qatorini takrorlashga yordam beradigan yangi 2018 xususiyat.

Bu juda ko'p!

Keyingi o'qish

ECMAScript 2015+

  1. Bu erda ECMAScript 2016, 2017 va 2018-dagi barcha narsalarga misollar keltirilgan
  2. Ushbu foydali ECMAScript 2015 (ES6) maslahatlari bilan tanishib chiqing
  3. 5 ES6-da tuzatilgan JavaScript "yomon" qismlari
  4. ES6-dagi "sinf" yangi "yomon" qismmi?

Mening boshqa xabarlarimni bu erda topishingiz mumkin.

Agar bu foydali bo'lsa, iltimos, qo'llab-quvvatlashingizni namoyish qilish uchun iltimos, ap tugmasini bosing. ⬇⬇⬇