Как изменить значение свойства в объекте?

👨‍💻 Frontend Developer 🟠 Может встретиться 🎚️ Легкий
#JavaScript #Объекты #База JS

Краткий ответ

Изменить значение свойства в объекте можно теми же способами, что и добавлять новые свойства: через точечную нотацию или квадратные скобки. Если свойство уже существует, оно просто получит новое значение.


Полный ответ

Изменение значений свойств — одна из самых частых операций с объектами в JavaScript. Это просто и интуитивно понятно.

Основные способы изменения

1. Точечная нотация

Самый простой и часто используемый способ:

const user = { name: 'Иван', age: 25 };
user.name = 'Петр'; // Меняем значение свойства name
user.age = 30; // Меняем значение свойства age

2. Квадратные скобки

Позволяет использовать переменные и сложные ключи:

const user = { name: 'Иван', age: 25 };
user['name'] = 'Петр'; // То же самое, что и через точку

Простые примеры

Изменение простых значений

const car = { brand: 'Toyota', year: 2020 };
car.brand = 'Honda'; // Меняем марку
car.year = 2021; // Меняем год

Изменение вложенных объектов

const user = { 
  name: 'Иван', 
  address: { city: 'Москва', street: 'Ленина' } 
};
 
user.address.city = 'Санкт-Петербург'; // Меняем город

Когда что использовать

Точечная нотация

// Для простых ключей без пробелов
user.name = 'Новое имя';
car.model = 'Новая модель';

Квадратные скобки

// Для переменных или сложных ключей
const key = 'name';
user[key] = 'Новое имя';
 
// Для ключей с пробелами
user['user name'] = 'Иван';

Важные моменты

1. Объекты передаются по ссылке

const original = { name: 'Иван' };
const copy = original;
copy.name = 'Петр';
console.log(original.name); // 'Петр' - исходный объект тоже изменился!

2. Создание новых свойств

const user = { name: 'Иван' };
user.age = 25; // Если свойства не было - оно создастся

Частые ошибки

1. Попытка изменить несуществующее свойство через переменную

// ❌ Ошибка при неправильном использовании
const user = { name: 'Иван' };
const key = 'nonexistent';
user.key = 'value'; // Создаст свойство 'key', а не значение переменной key
 
// ✅ Правильно
user[key] = 'value'; // Создаст свойство 'nonexistent'

2. Непонимание ссылочного характера

// ❌ Неожиданные изменения
function changeUser(user) {
  user.name = 'Новое имя'; // Меняет исходный объект!
}
 
const originalUser = { name: 'Иван' };
changeUser(originalUser);
console.log(originalUser.name); // 'Новое имя'

Простые правила

  1. Точечная нотация — для простых ключей
  2. Квадратные скобки — для переменных и сложных ключей
  3. Осторожно с ссылками — изменения видны везде, где есть ссылка
  4. Несуществующие свойства — создаются автоматически
  5. Вложенные объекты — меняются по тому же принципу

Изменение свойств объектов — базовая операция в JavaScript. Понимание простых правил помогает избежать ошибок и писать предсказуемый код.


Хотите больше статей для подготовки к собеседованиям? Подписывайтесь на EasyAdvice, добавляйте сайт в закладки и совершенствуйтесь каждый день 💪