JavaScript tenglik operatorlari: ==, === va Object.is

Qisqacha: JavaScript'da ikki qiymat tengligini uch xil usulda tekshirish mumkin. Qat'iy tenglik === tur va qiymatni birga solishtiradi — deyarli har doim shuni ishlating. Yumshoq tenglik == esa avval turlarni o'zgartiradi, shuning uchun 0 == "" kabi kutilmagan true beradi. Uchinchi usul — Object.is: u NaN va -0 ni ham to'g'ri ajratadi.

Bu darsda

• === va !== bilan qiymatlarni to'g'ri solishtira olasiz.
• == turlarni qanday o'zgartirishini va nega xavfli ekanini tushuntira olasiz.
• x == null qisqa yozuvini qachon ishlatish mumkinligini bilasiz.
• NaN va -0 tuzoqlarini taniysiz va Object.is bilan ularni tekshira olasiz.
• JavaScript ichidagi to'rt xil tenglik qoidasini nomi bilan ajrata olasiz.

Oldin bilishingiz kerak: Taqqoslash operatorlari, undefined va null, Boolean va truthy/falsy qiymatlar.

1. Nega bu kerak?

O'tgan darsda < va > bilan sonlarni solishtirdik. Endi eng ko'p beriladigan savol: "bu ikki qiymat tengmi?"

Tasavvur qiling: siz to'lov sahifasini yozyapsiz. Buyurtma summasi — 50000 soni. Foydalanuvchi esa forma maydoniga 50000 deb yozdi. HTML formadan kelgan qiymat har doim satr bo'ladi — "50000".

const buyurtmaSummasi = 50000;
const kiritilganSumma = "50000"; // formadan satr bo'lib keldi

console.log(buyurtmaSummasi == kiritilganSumma); // true
console.log(buyurtmaSummasi === kiritilganSumma); // false

Bir xil savol — ikki xil javob! Undan ham g'alatisi bor:

console.log(0 == ""); // true

Bo'sh forma maydoni nolga tengmi? Chegirma 0 so'm bo'lsa-yu, maydon bo'sh qolsa — dastur ularni bir xil deb o'ylaydi. Shunday xato to'lov tizimida bo'lsa, pul noto'g'ri hisoblanadi.

Bu darsdan keyin qaysi operator nima qilishini aniq bilasiz va bunday tuzoqqa tushmaysiz.

2. Qat'iy tenglik: ===

2.1 Tur ham, qiymat ham bir xil bo'lishi kerak

Qat'iy tenglik (strict equality) — === operatori. U ikki narsani tekshiradi: turlar bir xilmi va qiymatlar bir xilmi. Ikkalasi ham mos kelsa — true, aks holda — false.

Hayotdan o'xshatish: bank kassiri. Siz "100" deysiz. Kassir faqat raqamga emas, valyutaga ham qaraydi: 100 so'm va 100 dollar — teng emas. === ham xuddi shunday: 5 (son) va "5" (satr) — teng emas.

console.log(5 === 5); // true
console.log(5 === "5"); // false
console.log("Ali" === "Ali"); // true
console.log("Ali" === "ali"); // false
console.log(true === true); // true
console.log(null === null); // true
console.log(null === undefined); // false

Qatorma-qator ko'ramiz:

• 5 === "5" — biri son, biri satr. Tur har xil, demak darhol false.
• "Ali" === "ali" — ikkalasi satr, lekin katta-kichik harf farq qiladi. Satrlar harfma-harf solishtiriladi.
• null === undefined — ikkalasi ham "yo'qlik", lekin ular ikki xil tur. Shuning uchun false.

=== hech qachon qiymatni boshqa turga o'zgartirmaydi. U nima ko'rsa, shuni solishtiradi. Shuning uchun uning natijasini oldindan aytish oson.

2.2 !== — qat'iy teng emas

!== — === ning teskarisi. Qiymatlar teng bo'lmasa true qaytaradi.

const shahar = "Toshkent";

console.log(shahar !== "Samarqand"); // true
console.log(shahar !== "Toshkent"); // false
console.log(10 !== "10"); // true

Oxirgi qatorga qarang: 10 va "10" — turlari har xil, demak ular "teng emas". Natija true.

Tekshirib ko'ring: console.log(7 === "7") va console.log("7" !== "7") nima chiqaradi?

3. Yumshoq tenglik: ==

3.1 == avval turni o'zgartiradi

Yumshoq tenglik (loose equality) — == operatori. U turlar har xil bo'lsa, qiymatlardan birini (yoki ikkalasini) boshqa turga o'zgartiradi. Keyin solishtiradi.

Bu yashirin o'zgartirish coercion (inglizcha "majburlash") deb ataladi. Siz uni taqqoslash darsida ko'rgansiz: "10" > 9 da satr songa aylanib qolgan edi.

O'xshatish: bu — "raqami bir xil bo'lsa bo'ldi" deydigan kassir. U 100 so'm bilan 100 dollarni farqlamaydi.

== ning qoidalari to'liq holda ancha uzun. Oddiy qiymatlar (son, satr, boolean, null, undefined) uchun ularni uch qadamga qisqartirish mumkin:

Obyektlar uchun yana bitta qoida bor. Uni yashirin coercion darsida ko'ramiz.

3.2 Qiymat songa qanday aylanadi?

3-qadam eng ko'p hayratlantiradi. Keling, qaysi qiymat qaysi songa aylanishini ko'ramiz. Buni arifmetika darsidagi unar + bilan tekshirish mumkin — u qiymatni songa aylantiradi:

console.log(+"5"); // 5
console.log(+""); // 0
console.log(+"  "); // 0
console.log(+"salom"); // NaN
console.log(+true); // 1
console.log(+false); // 0

Esda tuting:

• Raqamli satr — shu songa aylanadi: "5" → 5.
• Bo'sh yoki faqat bo'sh joydan iborat satr — 0 ga aylanadi.
• Raqam bo'lmagan satr — NaN ga aylanadi.
• true → 1, false → 0.

3.3 Kutilmagan natijalar

Endi bu qoidalarni == ga qo'llaymiz:

console.log(5 == "5"); // true
console.log(0 == ""); // true
console.log(0 == "0"); // true
console.log("0" == false); // true
console.log("" == false); // true
console.log("1" == true); // true
console.log("2" == true); // false
console.log("true" == true); // false

Oxirgi ikkitasini sekin ko'ramiz, chunki ular eng ko'p chalg'itadi:

• "2" == true: true songa aylanadi — 1. "2" songa aylanadi — 2. 2 == 1 — false.
• "true" == true: true → 1. "true" esa raqam emas → NaN. NaN == 1 — false.

Ya'ni "true" satri true ga "teng emas". Ko'zga bir xil ko'rinsa ham.

Yana bir g'aroyib holat. Matematikada A = B va B = C bo'lsa, A = C bo'ladi. == da esa bu qoida ham buziladi:

console.log("0" == 0); // true
console.log(0 == ""); // true
console.log("0" == ""); // false

"0" nolga teng, bo'sh satr ham nolga teng, lekin ular bir-biriga teng emas! Uchinchi qatorda ikkalasi ham satr. Turlar bir xil bo'lgani uchun hech narsa o'zgarmadi — 1-qadam ishladi. "0" va "" esa har xil satrlar.

Boshida bu chalkash tuyulishi tabiiy. Aynan shu sababli dasturchilar == dan qochadi.

3.4 != — yumshoq teng emas

!= — == ning teskarisi. U ham turlarni o'zgartiradi:

console.log(5 != "5"); // false
console.log(5 !== "5"); // true

5 != "5" — "teng emasmi?" savoliga false beradi, chunki == bo'yicha ular teng. !== esa turga qaraydi va true beradi.

Tekshirib ko'ring: console.log(1 == "1.0") nima chiqaradi? console.log(1 === "1.0")-chi?

4. null va undefined bilan ==: foydali istisno

== ning bitta qoidasi haqiqatan qulay. U 2-qadamda edi: null va undefined faqat bir-biriga teng. Ular 0, "" yoki false ga teng emas.

console.log(null == undefined); // true
console.log(null == 0); // false
console.log(undefined == ""); // false
console.log(null == false); // false

Diqqat: null == 0 — false, lekin taqqoslash darsida ko'rgan null >= 0 — true. Sababi: >= null ni songa (0) aylantiradi, == esa aylantirmaydi. Bu JavaScript'ning tarixiy g'alatiligi — shunchaki eslab qoling.

Bundan undefined va null darsida ko'rgan x == null qisqa yozuvi (idioma) kelib chiqadi. U bitta tekshiruvda "qiymat null yoki undefinedmi?" deb so'raydi, 0 va "" uchun esa false beradi. Endi nega shunday ishlashini ham bilasiz — jadvaldagi 2-qadam.

Ko'p jamoalarda == taqiqlangan, lekin aynan x == null ga ruxsat beriladi. O'sha darsda qisqa ko'rgan ?? operatori esa zaxira qiymat berish ishini yanada qulay bajaradi — uni ikki darsdan keyin to'liq o'rganamiz.

Tekshirib ko'ring: let yosh = 0; bo'lsa, console.log(yosh == null) nima chiqaradi?

5. NaN va -0: === ham adashadigan ikki holat

=== ishonchli, lekin ikkita nozik holat bor. Ikkalasi ham sonlar bilan bog'liq.

5.1 NaN o'ziga ham teng emas

NaN ("Not a Number" — son emas) noto'g'ri hisob-kitobdan chiqadi. Masalan, "salom" * 2. U JavaScript'dagi yagona qiymat: o'ziga ham teng emas.

const natija = "salom" * 2;

console.log(natija); // NaN
console.log(natija === NaN); // false
console.log(natija == NaN); // false
console.log(NaN === NaN); // false

Nega shunday? NaN — "qandaydir son emas narsa" degani. Ikki "noma'lum" bir-biriga teng deb aytib bo'lmaydi. O'xshatish: ikki anketada "yosh" maydoniga "bilmayman" deb yozilgan. Bu ular tengdosh degani emas.

Demak, x === NaN deb tekshirish hech qachon ishlamaydi — natija doim false. To'g'ri usulni pastda, Object.is bo'limida ko'ramiz.

5.2 +0 va -0

JavaScript'da nolning ikki ko'rinishi bor: 0 (aslida +0) va -0. Manfiy son nolga ko'paytirilsa, -0 chiqadi:

const nol = 0 * -5;

console.log(nol); // -0
console.log(nol === 0); // true

=== ular orasida farq ko'rmaydi. Ko'pincha bu to'g'ri — hisob-kitobda ular bir xil ishlaydi. Lekin ular bo'linishda farq qiladi:

console.log(1 / 0); // Infinity
console.log(1 / -0); // -Infinity

-0 "noldan manfiy tomonga yaqinlashdik" degan belgini saqlaydi. Masalan, harorat grafigida yoki tezlik yo'nalishida bu muhim bo'lishi mumkin. -0 ning qayerdan kelishini Number turi darsida chuqurroq ko'ramiz.

5.3 Object.is — eng aniq tenglik

Object.is(a, b) — ikki qiymat "aynan bir xil"mi, shuni tekshiradi. U xuddi console.log(...) kabi chaqiriladi: qavs ichiga vergul bilan ikki qiymat beriladi.

Maslahat: Object — JavaScript'ning tayyor "asboblar qutisi", .is — undagi asboblardan biri. Obyekt nima ekanini obyektlar darsida batafsil o'rganamiz. Hozircha Object.is(...) ni bitta butun buyruq deb qabul qiling.

Object.is deyarli === kabi ishlaydi. Farq faqat ikki holatda:

console.log(Object.is(NaN, NaN)); // true
console.log(Object.is(0, -0)); // false
console.log(Object.is(5, 5)); // true
console.log(Object.is(5, "5")); // false

Yonma-yon solishtiramiz:

Endi qiymat NaN ekanini to'g'ri tekshira olamiz:

const narx = "ming" * 3;

console.log(narx === NaN); // false
console.log(Object.is(narx, NaN)); // true

Maslahat: NaN ni tekshirish uchun maxsus Number.isNaN(x) ham bor. Uni matn va son darsida o'rganamiz. Real kodda ko'pincha o'shani ko'rasiz.

Tekshirib ko'ring: console.log(Object.is(null, undefined)) nima chiqaradi?

6. JavaScript ichidagi to'rtta tenglik qoidasi

JavaScript'ning rasmiy standartida (ECMAScript) tenglikning to'rt xil qoidasi bor. Ikkitasini operator sifatida ko'rdingiz. Qolgan ikkitasi ichkarida, turli joylarda ishlaydi:

SameValue ("aynan bir xil qiymat") — Object.is ning qoidasi. SameValueZero ("bir xil qiymat, nollar bir xil") esa NaN ni NaN ga teng deb biladi, lekin 0 va -0 ni farqlamaydi.

SameValueZero'ni massivda qidirish darsida includes metodi orqali uchratasiz. U yerda NaN ni topish mumkin, boshqa usullar esa topa olmaydi. Map va Set — ma'lumot saqlash uchun maxsus "qutilar", ularni Map darsida o'rganamiz. Hozir bu nomlarni eslab qolishingiz shart emas — faqat "tenglik bitta emas" ekanini biling.

Maslahat: Obyektlarni === bilan solishtirish boshqacha ishlaydi: ichidagi qiymatlar emas, "bir xil qutimi?" degan savol tekshiriladi. Buni havola semantikasi darsida ko'ramiz.

7. Qaysi birini ishlatish kerak?

Oddiy qoida:

Nega ===? Uning natijasini jadvalsiz, boshda aytib bera olasiz. == da esa har safar "qaysi tomon songa aylanadi?" deb o'ylash kerak. Kodni o'qigan boshqa dasturchi ham shu savolni beradi.

Formadan kelgan "50000" ni son bilan solishtirish kerak bo'lsa, avval uni o'zingiz songa aylantiring. Keyin === ishlating. Aylantirish sizning qo'lingizda bo'ladi, yashirin emas:

const buyurtmaSummasi = 50000;
const kiritilganSumma = "50000";

console.log(+kiritilganSumma === buyurtmaSummasi); // true

Turni aniq o'zgartirishning boshqa usullarini (Number(), String()) turlarni aniq o'zgartirish darsida ko'ramiz.

O'zingiz to'ldiring: +"7" === 7 ning natijasi [:true], "7" === 7 niki esa [:false].

8. Ko'p uchraydigan xatolar

8.1 === o'rniga = yozish

Bitta = — tenglik emas, tayinlash. U o'zgaruvchiga yangi qiymat yozadi:

let ism = "Vali";

console.log(ism = "Ali"); // Ali
console.log(ism); // Ali

Biz "ism Ali'ga tengmi?" demoqchi edik. Aslida esa ism ga "Ali" yozib qo'ydik — eski qiymat yo'qoldi. const bilan bu xato darhol ko'rinadi:

const ism = "Vali";

console.log(ism = "Ali");

TypeError: Assignment to constant variable.

Tarjimasi: "o'zgarmas o'zgaruvchiga qiymat tayinlash". Siz solishtirmoqchi edingiz, JavaScript esa tayinlash deb tushundi. Bu xatoni ko'rsangiz, = sonini sanang: tenglik uchun uchta — ===.

8.2 NaN ni === bilan tekshirish

const summa = "yuz" * 1;

console.log(summa === NaN); // false

Bu tekshiruv doim false beradi — hatto summa haqiqatan NaN bo'lsa ham. To'g'risi: Object.is(summa, NaN).

8.3 == true bilan tekshirish

Truthy/falsy darsida bo'sh bo'lmagan satr truthy ekanini o'rgandik. Lekin "salom" == true — false:

console.log("salom" == true); // false
console.log(!!"salom"); // true

Sababi: == qiymatni boolean'ga emas, songa aylantiradi. "salom" → NaN, true → 1. NaN == 1 — false. Qiymat truthy ekanini bilish uchun !! yoki Boolean() ishlating, == true emas.

8.4 Formadan kelgan qiymatni to'g'ridan-to'g'ri === qilish

const tanlanganXona = "3"; // formadan keldi
const bronXonasi = 3;

console.log(tanlanganXona === bronXonasi); // false

Kod xato bermaydi, lekin natija noto'g'ri: foydalanuvchi aynan 3-xonani tanlagan. Tuzatish — == ga o'tish emas, avval songa aylantirish: +tanlanganXona === bronXonasi.

9. Mashqlar

1-mashq (oson): Natijani toping

Kodni ishga tushirmasdan, har bir qator nima chiqarishini daftarga yozing. Keyin tekshiring.

console.log(10 === 10);
console.log(10 === "10");
console.log(10 == "10");
console.log("Jasur" !== "jasur");
console.log(undefined == null);
console.log(undefined === null);

console.log(10 === 10); // true
console.log(10 === "10"); // false
console.log(10 == "10"); // true
console.log("Jasur" !== "jasur"); // true
console.log(undefined == null); // true
console.log(undefined === null); // false

2-mashq (o'rta): Taksi tarifi

Taksi ilovasida "Komfort" tarifining raqami — 2. Foydalanuvchi tarifni tanladi va formadan "2" keldi.

const komfortTarif = 2;
const tanlanganTarif = "2";

Uch qator yozing:

1. === bilan to'g'ridan-to'g'ri solishtiring.
2. == bilan solishtiring.
3. tanlanganTarif ni unar + bilan songa aylantirib, === bilan solishtiring.

Qaysi natija ishonchli va nega?

const komfortTarif = 2;
const tanlanganTarif = "2";

console.log(tanlanganTarif === komfortTarif); // false
console.log(tanlanganTarif == komfortTarif); // true
console.log(+tanlanganTarif === komfortTarif); // true

3-mashq (qiyin): Uch xil tenglik

Quyidagi o'zgaruvchilar berilgan:

const a = 0 * -1;
const b = 0;
const c = "olma" * 2;
const d = undefined;

Har biri uchun bitta console.log yozing (jami 6 qator):

1. a va b ni === bilan solishtiring.
2. a va b ni Object.is bilan solishtiring.
3. c ni o'zi bilan === orqali solishtiring.
4. c ni o'zi bilan Object.is orqali solishtiring.
5. d null yoki undefined ekanini bitta tekshiruv bilan aniqlang.
6. b null yoki undefined ekanini xuddi shu usulda aniqlang.

Har bir natijani ishga tushirishdan oldin taxmin qiling.

const a = 0 * -1;
const b = 0;
const c = "olma" * 2;
const d = undefined;

console.log(a === b); // true
console.log(Object.is(a, b)); // false
console.log(c === c); // false
console.log(Object.is(c, c)); // true
console.log(d == null); // true
console.log(b == null); // false

10. Real ishda

• Kod tekshiruvchi vositalar. Ko'p jamoalar ESLint ishlatadi — u kodni avtomatik tekshirib, xatolarni ko'rsatadigan dastur (kursda alohida o'rganamiz). Uning eqeqeq qoidasi == ni ko'rsa, ogohlantiradi. Faqat x == null ga ruxsat beradigan sozlama ham bor.
• TypeScript (JavaScript'ning turlarni tekshiradigan ko'rinishi, kursda alohida qism bor) son va satrni === bilan solishtirsangiz, kod ishga tushmasdan oldin ogohlantiradi.
• React (sayt yasash uchun mashhur vosita) ekrandagi ma'lumot o'zgarganini aynan Object.is bilan tekshiradi. Shuning uchun uni bilish keyinchalik foydali bo'ladi.
• Intervyu. "== va === ning farqi nima?" — boshlang'ich dasturchiga beriladigan eng mashhur savollardan biri. Yaxshi javob: "=== turni o'zgartirmaydi; == o'zgartiradi, shuning uchun 0 == "" — true. Men === ishlataman, faqat x == null bundan mustasno."

Xulosa

• === tur va qiymatni birga tekshiradi, hech narsani o'zgartirmaydi. Standart tanlov — shu.
• == turlar har xil bo'lsa, ko'pincha ikkalasini songa aylantiradi. Natijada 0 == "" va "0" == false — true.
• null va undefined == bo'yicha faqat bir-biriga teng. x == null — ikkalasini birga tekshirishning qisqa usuli.
• NaN o'ziga ham teng emas, 0 === -0 esa true. Bu holatlarda Object.is aniq javob beradi.
• JavaScript'da to'rt tenglik qoidasi bor: ==, ===, SameValue (Object.is) va SameValueZero (includes).

Keyingi dars: Mantiqiy operatorlar va qisqa tutashuv — &&, || va ! bilan shartlarni birlashtirishni o'rganamiz.