Главная страница » JavaScript » 41. Свойств

41. Свойств

В JavaScript объекты являются основной структурой данных. Каждый объект состоит из набора свойств, где каждое свойство представляет собой пару «ключ-значение». Свойства позволяют хранить данные и функционал внутри объектов.

В этом уроке мы рассмотрим, что такое свойства, как их создавать, изменять и удалять, а также обсудим некоторые особенности работы со свойствами объектов.

Свойства объектов: ключи и значения

Каждое свойство объекта имеет:

Ключ — это имя свойства.
Значение — данные, ассоциированные с этим ключом.

Пример объекта:

				
					let person = {
  name: "John",
  age: 30,
  isEmployed: true
};

В этом объекте person есть три свойства:

name с значением "John"
age с значением 30
isEmployed с значением true

Доступ к свойствам

Доступ к свойствам объекта осуществляется двумя способами:

Через точечную нотацию (dot notation)

				
					console.log(person.name); // "John"
console.log(person.age); // 30

Через квадратные скобки (bracket notation)

				
					console.log(person["name"]); // "John"
console.log(person["age"]); // 30

Квадратные скобки удобны для доступа к свойствам, имена которых содержат пробелы или специальные символы.

Создание и изменение свойств

Свойства можно добавлять к объекту или изменять их значения в любое время.

Добавление нового свойства

				
					person.job = "Engineer";
console.log(person.job); // "Engineer"

Изменение значения свойства

				
					person.age = 31;
console.log(person.age); // 31

Удаление свойств

Для удаления свойства используется оператор delete.

Удаление свойства

				
					delete person.isEmployed;
console.log(person.isEmployed); // undefined

Проверка наличия свойства

Чтобы проверить, существует ли свойство в объекте, можно использовать оператор in.

Проверка наличия свойства

				
					console.log("name" in person); // true
console.log("salary" in person); // false

Итерация по свойствам объекта

Для перебора всех свойств объекта используется цикл for...in.

Перебор свойств

				
					for (let key in person) {
  console.log(`${key}: ${person[key]}`);
}

Вывод:

				
					name: John
age: 31
job: Engineer

Свойства-аксессоры (геттеры и сеттеры)

JavaScript также поддерживает свойства-аксессоры, которые позволяют определять функции для получения (get) и установки (set) значений.

Пример с геттером и сеттером

				
					let user = {
  firstName: "John",
  lastName: "Doe",

  get fullName() {
    return `${this.firstName} ${this.lastName}`;
  },

  set fullName(name) {
    [this.firstName, this.lastName] = name.split(" ");
  }
};

console.log(user.fullName); // "John Doe"
user.fullName = "Jane Smith";
console.log(user.fullName); // "Jane Smith"

Распространенные ошибки

Опечатки в именах свойств

Если вы допустите опечатку в имени свойства, JavaScript не выдаст ошибку, а просто создаст новое свойство с неверным именем.

				
					let car = {
  color: "red"
};

car.clor = "blue"; // ошибка: "clor" вместо "color"
console.log(car.color); // "red"
console.log(car.clor); // "blue"

Переопределение свойств

Если случайно присвоить значение существующему свойству, это приведет к его изменению.

				
					let item = {
  name: "Laptop",
  price: 1000
};

item.price = 900; // свойство "price" изменено
console.log(item.price); // 900

Попытка доступа к несуществующему свойству

Доступ к несуществующему свойству возвращает undefined, что может привести к ошибкам, если это значение используется в дальнейшем.

				
					let house = {};
console.log(house.rooms); // undefined

Заключение

Свойства объектов являются основным средством хранения данных в JavaScript. Правильное понимание работы с ними поможет вам создавать более гибкие и удобные структуры данных. Важно быть внимательным при доступе к свойствам и их изменении, чтобы избежать распространенных ошибок.

Тестовое задание

Создайте объект book с тремя свойствами: title, author и year.
Напишите функцию describeBook, которая принимает объект book и возвращает строку вида: «Название: title, Автор: author, Год: year».
Добавьте к объекту book новое свойство publisher, и измените год издания.

Пример решения:

				
					// Задание 1
let book = {
  title: "JavaScript: The Good Parts",
  author: "Douglas Crockford",
  year: 2008
};

// Задание 2
function describeBook(book) {
  return `Название: ${book.title}, Автор: ${book.author}, Год: ${book.year}`;
}

console.log(describeBook(book)); // "Название: JavaScript: The Good Parts, Автор: Douglas Crockford, Год: 2008"

// Задание 3
book.publisher = "O'Reilly Media";
book.year = 2020;
console.log(describeBook(book)); // "Название: JavaScript: The Good Parts, Автор: Douglas Crockford, Год: 2020"

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

Регистрация

Вход

Поиск