Объекты в JavaScript и их свойства

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

Введение в объекты JavaScript

В JavaScript объект представляет собой неупорядоченный набор пар ключ-значение. Каждая пара ключ-значение называется свойством.

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

JavaScript предоставляет вам множество способов создания объекта. Чаще всего используется литеральная нотация объекта.

В следующем примере создается пустой объект с использованием литеральной записи объекта:

let empty = {};

Чтобы создать объект со свойствами, вы используете key:value в фигурных скобках. Например, в следующем примере создадим новый объект person :

let person = { firstName: 'John', lastName: 'Doe' };

Объект person имеет два свойства firstName и lastName с соответствующими значениями 'John' и 'Doe'.

Когда объект имеет несколько свойств, вы используете запятую ( , ) для их разделения, как в приведенном выше примере.

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

Чтобы получить доступ к свойству объекта, вы используете одну из двух нотаций: точечную или нотацию, подобную массиву.

1) Точечная запись(.)

Ниже показано, как использовать запись через точку для доступа к свойству объекта:

objectName.propertyName

Например, чтобы получить доступ к свойству firstName объекта person, вы используете следующее выражение:

person.firstName

В этом примере создается объект person и отображаются имя и фамилия в консоли:

let person = { firstName: 'John', lastName: 'Doe' }; 
console.log(person.firstName); 
console.log(person.lastName);

2) Массивная нотация( [] )

Ниже показано, как получить доступ к значению свойства объекта через нотацию, подобную массиву:

objectName['propertyName']

Например:

let person = { firstName: 'John', lastName: 'Doe' }; 
console.log(person['firstName']); console.log(person['lastName']);

Если имя свойства содержит пробелы, его необходимо заключить в кавычки. Например, следующий address объект имеет в качестве свойства 'building no' :

let address = { 'building no': 3960, street: 'North 1st street', state: 'CA', country: 'USA' };

Чтобы получить доступ к свойству 'building no', вам нужно использовать нотацию, подобную массиву:

address['building no'];

Если вы используете точечную нотацию, вы получите ошибку:

address.'building no';

Ошибка:

SyntaxError: Unexpected string

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

Чтение из свойства, которое не существует, приведет к undefined. Например:

console.log(address.district);

Выход:

undefined

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

Чтобы изменить значение свойства, вы используете оператор присваивания( = ). Например:

let person = { firstName: 'John', lastName: 'Doe' }; 
person.firstName = 'Jane'; console.log(person);

Выход:

{ firstName: 'Jane', lastName: 'Doe' }

В этом примере мы изменили значение свойства firstName объекта person с 'John' на 'Jane'.

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

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

Следующий оператор добавляет свойство age к объекту person и присваивает ему значение 25:

person.age = 25;

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

Чтобы удалить свойство объекта, вы используете оператор delete :

delete objectName.propertyName;

В следующем примере свойство age удаляется из объекта person :

delete person.age;

Если вы попытаетесь повторно получить доступ к свойству age, вы получите undefined значение.

Проверка существования свойства

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

propertyName in objectName

Оператор in возвращает значение true, если propertyName существует в objectName.

В следующем примере создается объект employee и используется оператор in для проверки наличия в объекте свойств ssn и employeeId :

let employee = { firstName: 'Peter', lastName: 'Doe', employeeId: 1 }; 
console.log('ssn' in employee); 
console.log('employeeId' in employee);

Выход:

false true

Заключение

• Объект представляет собой набор пар ключ-значение.
• Используйте запись через точку ( . ) или запись в виде массива ( [] ) для доступа к свойству объекта.
• Оператор delete удаляет свойство объекта.
• Оператор in проверяет, существует ли свойство в объекте.