Свойства объекта в JavaScript
- Что такое свойство объекта
- Имена свойств
- Получение значения свойства
- Добавление и изменение свойств
- Удаление свойства
- Короткая запись свойств
- Вычисляемые свойства
- Проверка наличия свойства
- Итого
Объект удобно представлять как набор подписанных значений. Каждая такая запись называется свойством.
let user = {
name: 'Анна',
age: 28,
isAdmin: false,
};
В этом примере у объекта user три свойства: name, age и isAdmin.
Что такое свойство объекта
Свойство состоит из имени и значения. Имя еще часто называют ключом.
let user = {
name: 'Анна',
};
name - это имя свойства. ‘Анна’ - значение свойства.
Значением может быть строка, число, булево значение, массив, другой объект, функция или любой другой тип данных.
let user = {
name: 'Анна',
age: 28,
skills: ['HTML', 'CSS', 'JavaScript'],
contacts: {
email: 'anna@example.com',
},
};
Имена свойств
Если имя свойства похоже на обычное имя переменной, его можно записывать без кавычек.
let course = {
title: 'JavaScript',
lessons: 24,
};
Если в имени есть пробел, дефис или оно начинается с цифры, имя нужно заключить в кавычки.
let course = {
title: 'JavaScript',
'lesson count': 24,
'main-topic': 'objects',
'2026': 'new course',
};
Такие имена допустимы, но обращаться к ним через точку уже не получится. Для них используют квадратные скобки.
Получение значения свойства
Самый частый способ получить значение свойства - обратиться к нему через точку.
let user = {
name: 'Анна',
age: 28,
};
console.log(user.name); // Анна
console.log(user.age); // 28
Квадратные скобки нужны, когда имя свойства хранится в переменной или записано не как обычное имя.
let user = {
name: 'Анна',
age: 28,
'home city': 'Москва',
};
let field = 'age';
console.log(user[field]); // 28
console.log(user['home city']); // Москва
В записи user[field] JavaScript сначала смотрит значение переменной field, а потом ищет свойство с таким именем.
Добавление и изменение свойств
Свойство можно добавить после создания объекта.
let user = {
name: 'Анна',
};
user.age = 28;
user.city = 'Москва';
console.log(user);
Если свойства еще нет, оно будет создано. Если свойство уже есть, его значение заменится.
let user = {
name: 'Анна',
age: 28,
};
user.age = 29;
console.log(user.age); // 29
То же самое работает через квадратные скобки.
let user = {};
user['home city'] = 'Москва';
console.log(user['home city']); // Москва
Удаление свойства
Для удаления свойства используют оператор delete.
let user = {
name: 'Анна',
age: 28,
city: 'Москва',
};
delete user.city;
console.log(user); // { name: 'Анна', age: 28 }
delete удаляет свойство из объекта полностью. Если свойство должно остаться, но значения пока нет, чаще записывают null.
let user = {
name: 'Анна',
city: null,
};
Короткая запись свойств
Если имя переменной совпадает с именем свойства, можно использовать короткую запись.
let name = 'Анна';
let age = 28;
let user = {
name,
age,
};
console.log(user); // { name: 'Анна', age: 28 }
Такая запись равнозначна обычной.
let user = {
name: name,
age: age,
};
Вычисляемые свойства
Имя свойства можно взять из переменной прямо при создании объекта. Для этого имя записывают в квадратных скобках.
let field = 'email';
let user = {
name: 'Анна',
[field]: 'anna@example.com',
};
console.log(user.email); // anna@example.com
В этом примере JavaScript взял значение переменной field и создал свойство email.
Такой подход удобен, когда имя свойства зависит от данных, которые стали известны только во время выполнения программы.
let settingName = 'theme';
let settingValue = 'dark';
let settings = {
[settingName]: settingValue,
};
console.log(settings.theme); // dark
Проверка наличия свойства
Проверить, есть ли свойство в объекте, можно с помощью оператора in.
let user = {
name: 'Анна',
email: undefined,
};
console.log('name' in user); // true
console.log('email' in user); // true
console.log('city' in user); // false
in проверяет именно наличие свойства, а не его значение. Поэтому для email результат true, хотя значение равно undefined.
Итого
Свойства - основа работы с объектами. Через них мы храним данные, получаем нужные значения и меняем состояние объекта.
- Свойство состоит из имени и значения.
- Через точку удобно обращаться к простым именам:
user.name. - Квадратные скобки нужны для сложных и динамических имен:
user[field]. - Присваивание создает новое свойство или изменяет существующее.
deleteудаляет свойство из объекта.inпроверяет, есть ли свойство в объекте.