JavaScriptdagi obyektlar(Objects)

Ma'lumki, JavaScriptda sakkizta ma'lumot turi mavjud. Ulardan yettitasi "primitive" deb ataladi, chunki ularning qiymatlari faqat bitta narsani (masalan, string yoki son) o'z ichiga oladi. Bundan farqli o'laroq, ob'ektlar turli ma'lumotlarning kalitlar orqali to'plamini va yanada murakkab entitylarni saqlash uchun ishlatiladi.

JavaScriptdagi Obyektlar

Ma'lumki, JavaScriptda sakkizta ma'lumot turi mavjud. Ulardan yettitasi "primitive" deb ataladi, chunki ularning qiymatlari faqat bitta narsani (masalan, string yoki son) o'z ichiga oladi.

Bundan farqli o'laroq, ob'ektlar turli ma'lumotlarning kalitlar orqali to'plamini va yanada murakkab entitylarni saqlash uchun ishlatiladi. JavaScriptda ob'ektlar tilning deyarli har bir jihatiga kirib boradi. Shuning uchun biz ularga chuqurroq o'rganishdan oldin ob'ektlarni tushunib olishimiz kerak.

Ob'ektni figural qavslar yordamida {...} yaratish mumkin bo'lib, ixtiyoriy xususiyatlar ro'yxati mavjud bo'lishi mumkin. Xususiyat — bu "kalit: qiymat" juftligi bo'lib, kalit string (yoki "xususiyat nomi" deb ham ataladi) va qiymat esa har qanday narsa bo'lishi mumkin.

Ob'ektni fayllar bilan to'ldirilgan kabinet sifatida tasavvur qilishimiz mumkin. Har bir ma'lumot kabinet ichida kalit bo'yicha saqlanadi. Faylni nomi bilan osongina topish yoki fayl qo'shish/olib tashlash mumkin.

Object image

Bo'sh ob'ekt ("bo'sh kabinet") quyidagi ikki sintaksisdan biri bilan yaratilishi mumkin:

let user = new Object(); // "ob'ekt konstruktori" sintaksisi
let user = {}; // "ob'ekt literal" sintaksisi
Object empty image

Odatda, {...} figural qavslar ishlatiladi. Ushbu deklaratsiya ob'ekt literal deb ataladi.

Literallar va xususiyatlar

Biz {...} ichiga "kalit: qiymat" juftliklari sifatida darhol ba'zi xususiyatlarni qo'shishimiz mumkin:

let user = {
  // ob'ekt
  name: 'John', // kalit "name" bo'yicha "John" qiymati saqlanadi
  age: 30, // kalit "age" bo'yicha 30 qiymati saqlanadi
};

Xususiyat oldin ":" dan oldin kalit (yoki "nom" yoki "identifikator" deb ham ataladi) va undan keyin qiymat mavjud bo'ladi.

user ob'ektida ikkita xususiyat mavjud:

  1. Birinchi xususiyatning nomi "name" va qiymati "John".
  2. Ikkinchi xususiyatning nomi "age" va qiymati 30.

user ob'ekti ichida ikki ta fayl yozuvlari bilan belgilangan kabinet sifatida tasavvur qilish mumkin.

Object user image

Biz har qanday vaqtda fayllarni qo'shish, olib tashlash va o'qishimiz mumkin.

Xususiyat qiymatlari nuqta notatsiyasi yordamida kirish mumkin:

// ob'ekt xususiyat qiymatlarini oling:
alert(user.name); // John
alert(user.age); // 30

Qiymat har qanday turda bo'lishi mumkin. Keling, boolean qiymatini qo'shamiz:

user.isAdmin = true;
Object user is admin image

Xususiyatni olib tashlash uchun delete operatoridan foydalanishimiz mumkin:

delete user.age;
Object user delete image

Shuningdek, biz ko'p so'zli xususiyat nomlarini ishlatishimiz mumkin, lekin ular qo'shtirnoq ichida bo'lishi kerak:

let user = {
  name: 'John',
  age: 30,
  'likes birds': true, // ko'p so'zli xususiyat nomi qo'shtirnoq ichida bo'lishi kerak
};
Object user props image

Ro'yxatdagi oxirgi xususiyat vergul bilan tugashi mumkin:

let user = {
  name: 'John',
  age: 30,
};

Bu "trailing" yoki "hanging" vergul deb ataladi. Bu xususiyatlarni qo'shish/olib tashlash yoki ko'chirishni osonlashtiradi, chunki barcha qatorlar bir xil bo'ladi.

Kvadrat qavslar

Ko'p so'zli xususiyatlar uchun nuqta bilan kirish ishlamaydi:

// bu sintaksis xatosiga olib keladi
user.likes birds = true

JavaScript buni tushunmaydi. U user.likes ga murojaat qilmoqchi bo'lib, keyin kutilmagan birds so'ziga duch kelganda sintaksis xatosini chiqaradi.

Nuqta bilan kirish uchun kalit to'g'ri o'zgaruvchan identifikator bo'lishi kerak. Bu shuni anglatadiki: bo'shliqlarni o'z ichiga olmaydi, raqam bilan boshlanmaydi va maxsus belgilar ($ va _ ruxsat etiladi) kiritilmaydi.

Buning o'rniga, kvadrat qavsli notatsiya mavjud bo'lib, u har qanday string bilan ishlaydi:

let user = {};
 
// o'rnating
user['likes birds'] = true;
 
// oling
alert(user['likes birds']); // true
 
// o'chiring
delete user['likes birds'];

Endi hamma narsa yaxshi. Iltimos, qavslar ichidagi string to'g'ri qo'shtirnoq ichida ekanligini unutmang (har qanday turdagi qo'shtirnoq ishlaydi).

Kvadrat qavslar shuningdek, xususiyat nomini har qanday ifoda natijasi sifatida olish imkonini beradi – literal string o'rniga – masalan, o'zgaruvchi orqali:

let key = 'likes birds';
 
// bu `user["likes birds"] = true` bilan bir xil;
user[key] = true;

Bu yerda key o'zgaruvchisi ish vaqti davomida hisoblanishi yoki foydalanuvchi kiritishiga bog'liq bo'lishi mumkin. Va keyin biz uni xususiyatga kirish uchun ishlatamiz. Bu bizga katta moslashuvchanlik beradi.

Masalan:

let user = {
  name: 'John',
  age: 30,
};
 
let key = prompt('Foydalanuvchi haqida nimani bilmoqchisiz?', 'name');
 
// o'zgaruvchiga kirish orqali
alert(user[key]); // John (agar "name" kiritilsa)

Nuqta bilan kirish shu kabi usulda ishlatilishi mumkin emas:

let user = {
  name: 'John',
  age: 30,
};
 
let key = 'name';
alert(user.key); // undefined

Hisoblangan xususiyatlar

Ob'ekt yaratishda kvadrat qavslarni ob'ekt literal ichida ishlatishimiz mumkin. Bu hisoblangan xususiyatlar deb ataladi.

Masalan:

let fruit = prompt('Qaysi meva sotib olish kerak?', 'apple');
 
let bag = {
  [fruit]: 5, // xususiyat nomi meva o'zgaruvchisidan olinadi
};
 
alert(bag.apple); // 5 agar `fruit="apple"` bo'lsa

Hisoblangan xususiyatning ma'nosi oddiy: [fruit] degani xususiyat nomi fruit dan olinishi kerak.

Shunday qilib, agar mehmon "apple" kiritsa, bag {apple: 5} bo'ladi.

Bu asosan quyidagi kabi ishlaydi:

let fruit = prompt('Qaysi meva sotib olish kerak?', 'apple');
let bag = {};
 
// xususiyat nomini meva o'zgaruvchisidan oling
bag[fruit] = 5;

... Lekin u chiroyliroq ko'rinadi.

Shuningdek, kvadrat qavslar ichida yanada murakkab ifodalarni ishlatishimiz mumkin:

let fruit = 'apple';
let bag = {
  [fruit + 'Computers']: 5, // `bag.appleComputers = 5`
};

Kvadrat qavslar nuqta bilan kirishga qaraganda ancha kuchliroq. Ular har qanday xususiyat nomlari va o'zgaruvchilarni qabul qiladi. Lekin ular yozish uchun ham ko'proq mehnat talab qiladi.

Shuning uchun, aksariyat hollarda xususiyat nomlari ma'lum va oddiy bo'lsa, nuqta bilan kirish ishlatiladi. Agar bizga biror narsani murakkabroq qilish kerak bo'lsa, biz kvadrat qavslarga o'tamiz.

Xususiyat qiymatlarini qisqartirish

Haqiqiy kodda, ko'pincha xususiyat nomlari uchun mavjud o'zgaruvchilar qiymat sifatida ishlatiladi.

Masalan:

function makeUser(name, age) {
  return {
    name: name,
    age: age,
    // ...boshqa xususiyatlar
  };
}
 
let user = makeUser('John', 30);
alert(user.name); // John

Bu qisqartirilishi mumkin. Obyekt literalda xususiyat nomi va o'zgaruvchi nomi bir xil bo'lsa, name: name qisqa name sifatida yozilishi mumkin.

Shunday qilib, bizda:

function makeUser(name, age) {
  return {
    name, // name: name bilan bir xil
    age, // age: age bilan bir xil
    // ...
  };
}

Bunday "qisqartirilgan" xususiyatlar nomi qisqartirilgan xususiyatlar deyiladi. Ularni ishlatish juda keng tarqalgan, chunki kodni qisqa va ixcham qiladi.

Xususiyat nomlari cheklovlari

Xususiyat nomlari string yoki symbol bo'lishi kerak (symbol haqida keyinchalik gaplashamiz). Boshqa turdagi qiymatlar avtomatik ravishda stringga aylantiriladi.

Masalan, raqamlar avtomatik stringga aylantiriladi:

let obj = {
  0: 'test', // "0": "test" bilan bir xil
};
 
// ikkala kirish ham bir xil natija beradi
alert(obj['0']); // test
alert(obj[0]); // test (raqam stringga aylantiriladi)

Bu kodda 0 va "0" xuddi shu kalit sifatida ko'rib chiqiladi.

Ammo, ko'pincha biz stringli kalitlarni ishlatamiz. Boshqa tomondan, raqamli xususiyatlar qatorlarni saqlashda qo'llaniladi.

"in" operatori

Ob'ekt xususiyatiga kirishga harakat qilganda, bu mavjud bo'lmasa undefined qiymatini qaytaradi.

Misol uchun:

let user = {};
 
alert(user.noSuchProperty === undefined); // true ma'nosi: xususiyat yo'q

Shuni ham tekshirish mumkin, xususiyat mavjud yoki yo'qligini tekshirish uchun maxsus operator "key" in obj mavjud.

let user = { name: 'John', age: 30 };
 
alert('age' in user); // true, user.age mavjud
alert('blabla' in user); // false, user.blabla mavjud emas

Yuqoridagi misolda, natijalar faqat user.age va user.blabla mavjud yoki yo'qligini tekshirish uchun "age" va "blabla" kalitlarini taqqoslash orqali olinadi.

Agar biz biror xususiyat undefined qiymatga ega bo'lsa, "in" operatori buni farqlaydi:

let obj = {
  test: undefined,
};
 
alert(obj.test); // bu xususiyat mavjud, shuning uchun `undefined` qaytadi
alert('test' in obj); // true, bu xususiyat mavjud

Bu yerda obj.test xususiyatiga undefined qiymat berilgan. "in" operatori buni "yo'q" deb qaytarmaydi, chunki u haqiqatan ham mavjud: uning qiymati undefined.

for...in loopi

Oddiy bo'lgan for loopidan farqli ravishda, ob'ektlar uchun for...in loopi mavjud bo'lib, u ob'ektning barcha kalitlarini olish imkonini beradi.

Uning umumiy sintaksisi quyidagicha:

for (let key in object) {
  // kalitlarga oid kod
}

Misol:

let user = {
  name: 'John',
  age: 30,
  isAdmin: true,
};
 
for (let key in user) {
  // kalitlarni oling
  alert(key); // name, age, isAdmin
  // kalit bo'yicha qiymatlarni oling
  alert(user[key]); // John, 30, true
}

Tushuncha:

Obyektning xususiyatlari nuqta yoki kvadrat qavslar bilan kirish mumkin, kvadrat qavslar bizga ko'proq moslashuvchanlik beradi, lekin oddiy holda nuqta bilan kirish ishlatiladi.

Xususiyat nomi hisoblangan bo'lsa (yani dinamik bo'lsa), xususiyat nomini hisoblashga imkon beradigan kvadrat qavsli sintaksisni ishlatish kerak.

Xususiyat nomlari uchun kalitlar string yoki symbol bo'lishi kerak.

Xususiyat mavjudligini tekshirish uchun "in" operatoridan foydalanish mumkin.

Xususiyatlarni o'qish yoki o'zgartirish uchun for...in loopidan foydalanish mumkin.

Ushbu sahifada

Xato haqida xabar berish