Umuman olganda o'zi React'ni ishlatish ham SHART emas. Axir hammasini toza JavaScript'da yozishning iloji bo'lsa!

- degan ekan Afandi.

Aytgancha Instagram va YouTube kanalimga har kuni Reels/Shorts yuklab boryapman.

Insta: https://instagram.com/brogrammistuz

YouTube: https://youtube.com/@brogrammistuz

- Siz programmistmisiz?
- Yog'e, shunchaki havaskorman.
- Unda grammistmisiz?
- 😐

#kunhazili

Kodda chalg’ituvchi kichik narsa bor edi. Ko’pchilik bu sintaksisni bilmaydi. Agar qavs ichida qiymatlar vergul bilan ketma-ket yozilsa, faqat oxirgisi olinadi:


let i = (0,1,2,3);
console.log(i); // 3


Qavs ichida xohlagan ishingizni qilsangiz bo’ladi. Masalan setTimeout:


let i = (setTimeout(()=>alert()), 2);
console.log(i); // 2
// keyin alert ishlaydi

Aytgancha setTimeout 2-parametrini berish shart emas. O’zi nol bo’lib ketadi:


setTimeout(()=>alert());
// bir xil
setTimeout(()=>alert(), 0);

Lexical scopes in for-loop

For-loop strukturasi 4 ta asosiy ifodaviy qismlardan iborat:

for (ifoda1; ifoda2; ifoda3) {
 ifoda4;
}

1-ifoda sikl boshida FAQAT BIR MARTA ishga tushadi. Bu yerda biz ko’pincha o’zgaruvchilar e’lon qilamiz, boshlag’ich holatni belgilaymiz.

2-ifoda har safar sikl boshida ishga tushadi. Bu yerga sikl tugatilish sharti qo’yiladi.

4-ifoda siklimiz tanasi. 2-ifodadan ROST qiymatini olar ekanmiz, 4-ifoda har doim bajariladi.

3-ifoda har safar sikl tugaganida ishga tushadi. Bu yerda sikl yakunlangaida qilinishi kerak bo’lgan amal(lar)ni joylaymiz.

JavaScript’da “lexical scope” tushunchasi mavjud. Qisqacha ma’nosi leksik maydon. Yuqoridagi for-loop strukturasidagi ifodalarning har biri o’z leksik maydonini yarata oladi.

Misolga qaraydigan bo’lsak, setTimeout 1-ifodaning “lexical scope”ida joylashgan. Ifoda esa bir martagina ishga tushadi. O’zgaruvchi let orqali e’lon qilingani uchun “i”ning qiymati setTimeout uchun o’shaligicha qolaveradi.

1-ifoda ekvivalenti bunday bo’ladi:

let i = (setTimeout(()=>console.log(i)), 0);

// tushunarliroq qilib yozsak
{
 let i = 0;
 setTimeout(()=>console.log(i), 0);
}

Shunday ekan, for-loop’da bo’ladigan keyingi o’zgarishlarning setTimeout ichidagi “i”ga hech qanday tasiri yo’q. Chunki u alohida “lexical scope”da.

Javob: 0

Bunaqangi kod va tushunarsiz tushuntirishdan keyin...

“Let” o’zgaruvchi “For-loop”ni sekinlashtiradi

Kechagi mavzuni davom ettiradigan bo’lsak, for-loop ifodaviy qismlarining barchasida leksik maydon hosil qilish mumkinligini aytgandim. Agar for-loop uchun iterativ o’zgaruvchini “let” orqali e’lon qilsak, har bir iteratsiyada alohida leksik maydon hosil bo’ladi. Bu leksik maydonlar o’zidan oldigisiga ham bog’langan bo’ladi. Chunki yangi leksik maydonga undan oldigisidagi o’zgaruvchi qiymatlari nusxalab ko’chiriladi. Endi tassavur qiling ichma-ich yozilgan katta for-loop’lar “let” bilan ishlasa qanday gigant “lexical scope graph” hosil qiladi.

Agar JS engine’lar bu holatda shuncha ish qilyotgan bo’lsa, kodimiz tezligi tushib ketishi turgan gap. Bu bo’yicha V8 engine’da alohida raport qilingan. U yerdagi muhokamani o’qisangiz iloji boricha “for(;;)” strukturasini ishlatmaslik tavsiya qilingan. Albatta agar tezlik muhim bo’lsa. Uning o’rniga “for-of” yoki “for-in”lardan foydalanish nisbatan tezroq bo’lar ekan.

Agar “for(;;)”ni ishlatish chorasiz bo’lib qolsa, uni “var” bilan ishlatish ham kod tezligini oshiradi. Chunki bu holatda har bir iteratsiyada leksik maydonlar zanjiri hosil bo’lmaydi.

Benchmarking uchun kichik na’munaga link qoldiraman. Kodni bir necha marta yuritib ko’rsangiz, “var for-loop” nisbatan tezroq, “let for-loop” esa eng sekini ekaniligini ko’rasiz.

❗️DISCLAIMER ❗️
Tepagi post orqali endi hamma for-loop larni refaktor qilib chiqinglar, bo'lmasa dasturlaringiz qotib qoladi, demoqchi emasman. Tezlik deganda nisbiy tezlik nazarda tutilgan. Farq nanosekundlarda. Umuman dasturinguz qanchalik tez ishlashi ko'pincha bunday faktorlarga aloqador bo'lmaydi. Agar tezlik siz uchun muhim bo'lsa, JavaScript'dan boshqa tilni ishlatishni maslahat beraman.

Number.MIN_VALUE > 0 === true ?

JavaScript’ni yomon ko’rish uchun mana yana bitta sabab. Ma’lum bo’lishicha, Number.MIN_VALUE noldan katta eng kichik son ekan. Judayam chalg’ituvchi nom.

Agar sizga eng kichik butun son kerak bo’lsa Number.MIN_SAFE_INTEGER ni ishlating.

Dasturlash, xususan frontend bo'yicha bilimlarimni oshirishda ushbu manbaalardan foydalanaman:

Bloglar:
- https://css-tricks.com/
- https://www.joshwcomeau.com/
- https://kentcdodds.com/

Telegram kanallar, har xil mavzularda zo'r maqolalar post qilinadi:
- @thedevs
- @frontend_1
- @godofjs

YouTube:
- Google Chrome Developers
- HTTP 203, GUI challenge, The CSS Podcast seriyalarini asosan kuzatib boraman.
- JS Conf
- Fireship

IIFE (Immediately Invoked Function Expression)

Yaqinda Go dasturlash tilida IIFE sintaksis juda soddaligini ko'rib JavaScriptda ham shunday bo'lganda edi deb qoldim. Chunki Go'da funksiyani ortiqcha qavs ichiga olish shart emas ekan:

func(num int) int {
fmt.Println(num * num)
}(5)

JavaScript'da esa xuddi shu ifoda bunday bo'lardi:

(function(num) {
console.log(num * num)
})(5)

Shuni qavslarsiz qilsa bo'ladimi?

Ha! Faqat oldiga void qo'yish kerak bo'ladi:

void function(num) {
console.log(num * num)
}(5)

Agar asinxron funksiya bo'lsa, void yoki await qo'yish mumkin:

await async function(num) {
console.log(num * num)
}(5)

Lekin void ishlatganimizda funksiya qiymati undefined bo'lib qoladi. Shuning uchun uni faqat "side-effect" uchun ishlatish mumkin.
Shunaqa gaplar.

Git bo'yicha maslahat

Faylga o'zgartirish kiritish va faylning nomini o'zgartirishni bitta commit'da qilmang. Chunki Git buni eski nomli fayl o'chirildi va yangi fayl qo'shildi deb yozadi.

Bu narsaning minus tarafi faylning o'zgartirishlar tarixi yo'qlib ketadi. Men o'zim ko'pincha biror kod nega aynan shunday yozilganini bilish uchun fayl tarixiga qarayman. Lekin eng uzog'i bilan o'sha fayl yaratilgan paytgacha borish mumkin.

Agar yuqoridagi vaziyat bo'lgan bo'lsa, bu sizni asabingizni buzishi aniq. Chunki hech kim butun boshli PR o'zgarishlarini, hamma fayllarni tekshirib o'tirgisi kelmasa kerak.

Shuning uchun hamkasblarinigizga va o'zingizga rahmingiz kelsin, fayl nomini o'zgartirish yoki boshqa joyga ko'chirishni alohida commit'da bajaring. 🙂

(Agar fayl tarixi o'chmasligini oldini oladigan boshqa usullar bo'lsa, hamma bilan bo'lishing.)

2019-yil Astana shahriga borgandik.

Odamlar orasida "rehmet"dan boshqa hamma gap rus tilida gapirilayotganini, farzandlariga yoshligidan faqat rus tilida gapirayotganligini ko'rib rosa hafa bo'lgandim.

1 oy o'tib Varshavaga keldim. Bu yerda ham bir Qozog'istonlik inson bilan tanishib, biroz vaqt birga ishlagandik. "Nega qozoq tilini bilmaysan" desam, maktabda yaxshi o'qitmagan degandi. Lekin oiladachi?

Yevropadagi hamma davlatda o'zini tili bor. Hamma ingliz tilini bilsa ham, kutubxonalari o'zlarini tilidagi kitoblar bilan to'la. Konferensiyalari ham o'zlarini tilida bo'ladi.

Men ham ilgari ingliz tilida blog yozardim. Polshaga kelib, bizning ham tilimiz polyak tilidek rivojlangan bo'lsa qanday zo'r bo'lardi deb rosa orzu qilardim. O'zimdan boshladim: o'sha kundanoq hamma maqolalarimni o'zbek tilida yozishni boshlagandim.