- Obyekt yaratmaq, xassələri oxumaq, dəyişmək, əlavə etmək və silmək
- Obyektləri və massivləri destrukturlaşdırmaq
...ilə surət çıxarmaq və birləşdirmək, istinadla kopyalanmanı başa düşmək?.və??ilə olmayan qiymətləri təhlükəsiz emal etmək
Şagird vəsiqəsində ad, yaş, şəhər və maraqlar yazılır. Bunları dörd ayrı dəyişəndə saxlamaq olar, amma onlar bir-birinə bağlıdır — hamısı eyni şagirdi təsvir edir. JavaScript-də bir şeyin bütün məlumatını bir yerdə saxlamaq üçün obyektdən istifadə olunur.
Obyekt və xassələr
Fiqurlu mötərizədə yazılan açar: qiymət cütlərinin toplusu. Hər cüt xassə adlanır; qiymət istənilən tip ola bilər — ədəd, sətir, massiv, başqa obyekt və ya funksiya.
Xassəyə nöqtə ilə (student.name) və ya kvadrat mötərizə ilə (student['name']) müraciət olunur. Mötərizə açarın adı dəyişəndə saxlandıqda lazımdır. Obyektə yeni xassə əlavə etmək üçün sadəcə ona qiymət mənimsətmək kifayətdir, delete isə xassəni silir.
const student = {
name: 'Aysel',
age: 14,
city: 'Baku',
hobbies: ['chess', 'music'],
};
console.log(student.name);
console.log(student['city']);
console.log(student.hobbies[1]);
const key = 'age';
console.log(student[key]);
student.age = 15;
student.grade = 9;
delete student.city;
console.log(student);▸ Gözlənilən nəticə
Aysel
Baku
music
14
{ name: 'Aysel', age: 15, hobbies: [ 'chess', 'music' ], grade: 9 }Qiyməti funksiya olan xassəyə metod deyilir. Metodun içində this sözü həmin obyektin özünü göstərir. Object.keys, Object.values və Object.entries isə obyektin açarlarını, qiymətlərini və cütlərini massiv kimi qaytarır — onları dövrlə gəzmək rahatdır.
const counter = {
count: 0,
increase() {
this.count++;
return this.count;
},
};
counter.increase();
console.log(counter.increase());
const prices = { bread: 0.8, milk: 1.5, tea: 4 };
console.log(Object.keys(prices));
console.log(Object.values(prices));
for (const item of Object.keys(prices)) {
console.log(`${item}: ${prices[item]} AZN`);
}▸ Gözlənilən nəticə
2 [ 'bread', 'milk', 'tea' ] [ 0.8, 1.5, 4 ] bread: 0.8 AZN milk: 1.5 AZN tea: 4 AZN
Real proqramlarda ən çox obyektlər massivi ilə işləyirik: mağazanın malları, sinfin şagirdləri, sifarişlər. Əvvəlki dərsin massiv metodları burada çox faydalıdır.
const products = [
{ name: 'Laptop', price: 1200 },
{ name: 'Mouse', price: 25 },
{ name: 'Desk', price: 300 },
];
const cheap = products
.filter((p) => p.price < 500)
.map((p) => p.name);
const total = products.reduce((sum, p) => sum + p.price, 0);
console.log(cheap);
console.log('Total:', total);
console.log(products.find((p) => p.price > 1000));▸ Gözlənilən nəticə
[ 'Mouse', 'Desk' ]
Total: 1525
{ name: 'Laptop', price: 1200 }Destrukturlaşdırma
Destrukturlaşdırma obyektdən və ya massivdən bir neçə qiyməti bir sətirdə ayrı dəyişənlərə çıxarmağa imkan verir. Obyektdə dəyişənlər açarların adları ilə seçilir, massivdə isə mövqeyə görə. Adı dəyişmək (name: firstName) və susmaya görə qiymət vermək (country = 'Azerbaijan') də olar.
const user = { name: 'Murad', age: 16, city: 'Ganja' };
const { name, age } = user;
console.log(name, age);
const { name: firstName, country = 'Azerbaijan' } = user;
console.log(firstName, country);
const [gold, silver] = ['Leyla', 'Elvin', 'Aysel'];
console.log(gold, silver);
function printCard({ name, city }) {
console.log(`${name} lives in ${city}`);
}
printCard(user);▸ Gözlənilən nəticə
Murad 16 Murad Azerbaijan Leyla Elvin Murad lives in Ganja
Spread və rest: üç nöqtə
... operatoru massivi və ya obyekti «açıb səpələyir» — buna spread deyilir. Onunla surət çıxarmaq, massivləri birləşdirmək və obyektin bəzi xassələrini dəyişib yenisini yaratmaq olar. Eyni xassə iki dəfə gəlirsə, sonuncusu qalib gəlir. Destrukturlaşdırmada isə ... «qalan hər şeyi» yığır — buna rest deyilir.
const morning = ['tea', 'bread'];
const evening = ['soup', 'salad'];
const menu = [...morning, 'lunch', ...evening];
console.log(menu);
console.log(Math.max(...[4, 17, 9]));
const defaults = { theme: 'light', lang: 'az', fontSize: 16 };
const settings = { ...defaults, theme: 'dark' };
console.log(settings);
const { lang, ...others } = settings;
console.log(lang, others);▸ Gözlənilən nəticə
[ 'tea', 'bread', 'lunch', 'soup', 'salad' ]
17
{ theme: 'dark', lang: 'az', fontSize: 16 }
az { theme: 'dark', fontSize: 16 }const original = { score: 10 };
const sameObject = original;
const copy = { ...original };
sameObject.score = 99;
console.log(original.score);
console.log(copy.score);▸ Gözlənilən nəticə
99 10
Olmayan qiymətlər: ?. və ??
Serverdən gələn verilənlərdə bəzi xassələr olmaya bilər. null qiymətinin xassəsini oxumaq cəhdi xətaya səbəb olur. Optional chaining ?. bunun qarşısını alır: sol tərəf null və ya undefined-dırsa, sadəcə undefined qaytarır. ?? operatoru isə sol tərəf null və ya undefined olduqda sağdakı ehtiyat qiyməti verir.
const account = { login: 'elvin', profile: null };
console.log(account.profile?.avatar);
console.log(account.profile?.avatar ?? 'default.png');
const volume = 0;
console.log(volume || 50);
console.log(volume ?? 50);▸ Gözlənilən nəticə
undefined default.png 50 0
|| istənilən falsy qiyməti (o cümlədən 0-ı) əvəz edir, ?? isə yalnız null və undefined-ı.1) Destrukturlaşdırma ilə student obyektindən name və city-ni götür və bir sətirdə çap et. 2) Spread ilə obyektin surətini yarat, orada age 16 olsun və surəti çap et. 3) Orijinalın dəyişmədiyini yoxlamaq üçün student.age-i çap et.
const student = { name: 'Murad', age: 15, city: 'Baku' };
// 1) destructure name and city and print them
// 2) copy the object with spread, set age to 16, print the copy
// 3) print student.age▸ Gözlənilən nəticə
Murad Baku
{ name: 'Murad', age: 16, city: 'Baku' }
15Əsas fikirlər
- Obyekt
açar: qiymətcütlərindən ibarətdir; xassəyə.və ya[ ]ilə müraciət olunur. - Funksiya olan xassə metoddur; onun içində
thisobyektin özüdür. - Destrukturlaşdırma
const { a, b } = objvəconst [x, y] = arrqiymətləri dəyişənlərə çıxarır. ...spread surət çıxarır və birləşdirir, rest isə qalanları yığır.b = aobyekt surəti deyil, eyni obyektə istinaddır.?.olmayan xassədə xətanın qarşısını alır,??ehtiyat qiymət verir.
Özünü yoxla
10 sual. Hər düzgün cavab XP qazandırır.
field dəyişənindədirsə, xassəni necə oxumaq olar?