Funksiyalar bilan chuqur ishlash

Eski "var"

Eng dastlabki JavaScript'da o'zgaruvchilar faqat var orqali e'lon qilinardi. Bugun uni deyarli ishlatmaymiz, ammo eski kodlarda tez-tez uchraydi va u let/constdan jiddiy farq qiladi. Uni tushunish kutilmagan xatolardan asraydi.

var qanday ishlaydi?

Birinchi qarashda var ham let kabi ko'rinadi — o'zgaruvchi e'lon qiladi:

var-basic.js
// natija shu yerda chiqadi

Ammo ichkaridan u boshqacha xatti-harakat qiladi. Uch asosiy farqni ko'ramiz.

1-farq: var da blok ko'lami YO'Q

let/constdan farqli o'laroq, var o'zgaruvchisi bloklarni (agar blok funksiya bo'lmasa) e'tiborsiz qoldiradi. U blok ichida e'lon qilinsa ham, blokdan tashqarida ham ko'rinadi:

var-no-block.js
// natija shu yerda chiqadi

Agar var o'rniga let ishlatilganda edi, tashqaridagi console.log(test) xatolik berardi. Xuddi shu narsa for siklida ham sodir bo'ladi:

var-for.js
// natija shu yerda chiqadi
var ning ko'lami faqat funksiya yoki butun skript darajasida bo'ladi. Oddiy { } bloklar, if, for uni cheklamaydi. Bu ko'pincha kutilmagan xatolarga olib keladi.

Funksiya ichida esa var tashqariga chiqmaydi — bu yerda u odatdagidek cheklanadi:

var-function.js
// natija shu yerda chiqadi

2-farq: hoisting (yuqoriga ko'tarilish)

var e'lonlari funksiya (yoki skript) boshiga "ko'tariladi" — bu hoisting deb ataladi. Ya'ni o'zgaruvchini e'lon qilishdan oldin ishlatsangiz ham xatolik bo'lmaydi — u undefined bo'ladi:

var-hoisting.js
// natija shu yerda chiqadi

Nima sodir bo'ldi? JavaScript kodni shunday "o'qiydi": var phrase e'loni funksiya boshiga ko'tariladi, ammo qiymat berish (= 'Salom') o'z joyida qoladi. Shuning uchun birinchi console.log da o'zgaruvchi bor, lekin hali qiymatsiz — undefined.

Diqqat: faqat e'lon ko'tariladi, qiymat berish emas. Buni shunday tasavvur qiling: kod ichkarida var phrase; (yuqorida) va phrase = 'Salom'; (o'z joyida) ga bo'linadi.

let bilan esa bunday bo'lmaydi — e'londan oldin ishlatish xatolik beradi ("temporal dead zone"). Bu aslida yaxshi — xatoni yashirmasdan darhol ko'rsatadi.

3-farq: qayta e'lon qilishga ruxsat

Bir xil var o'zgaruvchisini bir necha marta qayta e'lon qilsa bo'ladi — hech qanday xatolik chiqmaydi (bu ham xatolarni yashiradi):

var-redeclare.js
// natija shu yerda chiqadi

let bilan bir xil o'zgaruvchini ikki marta e'lon qilish SyntaxError beradi — bu tasodifiy nom to'qnashuvidan asraydi.

Nega hozir let/const afzal?

Yuqoridagi "o'ziga xosliklar" aslida var ning kamchiliklari. Ular kodni tushunishni qiyinlashtiradi va yashirin xatolarga sabab bo'ladi. let va const ularni to'g'irlaydi:

Amaliy tavsiya: doim constdan boshlang. Agar qiymat keyin o'zgarishi kerak bo'lsa — letga o'ting. var ni esa yangi kodda umuman ishlatmaslik ma'qul.
Eski loyihalar va kutubxonalarda var hali ham ko'p uchraydi. Uni o'chirib tashlash shart emas, ammo uning xatti-harakatini bilishingiz kerak — aks holda "nega bu o'zgaruvchi bu yerda ham bor?" degan chalkashlikka tushishingiz mumkin.

Xulosa