roadmap.az

Menyu

JavaScript & DOMDərs 15 / 25

Obyektlər

Bir varlığa aid məlumatı birləşdir

Obyekt açar–dəyər cütlərini saxlayır. Sabit açarı nöqtə, dəyişəndən gələn açarı kvadrat mötərizə ilə oxu. Xassə mövcud olmadıqda oxunuş adətən undefined verir; xassənin varlığını yoxlamaq bundan ayrıdır.

const user = { name: 'Aysel', age: 20, settings: { theme: 'light' } };
const key = 'name';
console.log(user[key]);
const updated = { ...user, name: 'Leyla' };
const { name, age } = updated;
console.log(name, age, user.name); // Leyla 20 Aysel
console.log(Object.hasOwn(user, 'age')); // true
Nümunə

İstinadlar və surətlər

const another = user eyni obyektə istinaddır. {...user} yeni xarici obyekt yaradır, iç-içə settings isə paylaşılır. Onu dəyişmək üçün {...user, settings: {...user.settings, theme: 'dark'}} kimi dəyişən səviyyələrdə surət yarat.

Object.keys, Object.values, Object.entries obyektin öz sadalana bilən xassələrini gəzməyə kömək edir. delete user.age xassəni silir; user.age = undefined isə xassəni saxlayıb dəyərini dəyişir. Destrukturizasiya istinadların dərin surətini çıxarmır. Məlumatı paralel massivlərdə saxlamaq əvəzinə obyektlə modelləşdirmək əlaqəni aydın edir.

Əlavə qeydlər və mənbələr

Bir varlığa aid məlumatları açar-dəyər cütləri kimi saxla. Nöqtə və kvadrat mötərizə ilə xassələri oxu, yenilə və əlavə et; spread-in yalnız səthi surət çıxardığını nəzərə al.

Niyə vacibdir?

JavaScript istifadəçi hərəkətinə cavab verən və məlumatı emal edən səhifələr yaratmağa imkan verir.

Əvvəlki biliklər

Bu mövzuda

  • Obyekt və xassələr
  • Nöqtə və dinamik açarlar
  • İstinadlar və səthi surət

Mövzuya baxış

Mənbələr

Məşqin idarəetməsi
Addım 1 / 3

Profilin surətini yenilə

Adı və yaşı dəyişərək yeni obyektin sahələrini izləyin.

Hədəf: Yeni adı Leyla et.

Canlı nəticə

Giriş{"name":"Aysel","age":20}
Nəticə{"name":"Aysel","age":20}
Mənbə kodu
const next = { ...user, name: "Aysel", age: 20 };

Özün sına

İstifadəçi profili yarat. Adı dəyişdirilmiş surət hazırla; ilkin obyektin adının eyni qaldığını və iç-içə obyektin necə paylaşılmasını göstər.

Nəticəni necə yoxlayım?

Profilin surəti dəyişir, ilkin ad saxlanılır; dinamik açar və iç-içə istinad paylaşılması göstərilir.

Gözlənilən nəticə

  • Üst səviyyəli ad Aysel olaraq qalır.
  • Səthi surətdə şəhər paylaşılır; ayrıca address surətindən sonra şəhərlər ayrılır.
Aysel Leyla
Gəncə
Gəncə Şəki
Nümunə həllə bax

Əvvəl özün sına, sonra müqayisə et. Bu, mümkün həllərdən biridir.

Spread üst səviyyəni köçürür, lakin iç-içə address obyektini paylaşır. Onu ayrıca köçürmək paylaşmanı kəsir.

main.js

const profile = { name: 'Aysel', address: { city: 'Bakı' } };
const renamed = { ...profile, name: 'Leyla' };
console.log(profile.name, renamed.name);
renamed.address.city = 'Gəncə';
console.log(profile.address.city);
const independent = { ...profile, address: { ...profile.address } };
independent.address.city = 'Şəki';
console.log(profile.address.city, independent.address.city);

Praktikanı bitirdin?Özün qiymətləndirirsən. İrəliləyiş bu brauzerdə saxlanılır.