Привет, в этом уроке мы основательно пройдемся по типу данных object, рассмотрим типы объектов, свойства, научимся создавать объекты и узнаем различия между ними, а также поговорим об операторе typeof и нюансах его работы. Текстовый урок в полной версии статьи.
Object
object - ссылочный тип данных, является то самостоятельной единицей, имеющей свойства и определённый тип.
У объекта есть свойства которые с ним ассоциируется. Свойство объекта можно понимать как переменные закрепленные за ним.
Для того чтобы создать объект у нас есть несколько способов.
Конструктор класса
// Вызов конструктора класса Object
let objectExample_1 = new Object();
// Далее наполняем его данными
objectExample_1.name = 'John';
objectExample_1.age = 22;
В примере выше мы создали внутри объекта свойства name и age и записали в них данные.
Литерал
Мы можем использовать более простой и удобный синтаксис для создания объектов.
let objectExample_2 = {}
// наполнение объекта данными
objectExample_2.name = 'Alice';
objectExample_2.age = 30;
console.log(objectExample_2)
Если мы используем литеральный синтаксис, то можем создать объект сразу с значениями.
let objectExample_3 = {
name: 'Vladimir',
age: 25
}
console.log(objectExample_3)
Как видите, литеральный синтаксис намного удобнее нежели создание через конструктор класса. Его и будем использовать.
let user = {
firstName: 'John',
lastName: 'Doe',
age: 30,
gender: 'male'
}
Допустим я хочу получить имя данного пользователя.
console.log(user);
console.log(user.firstName);
Аналогичным образом я могу получить доступ ко всем значениям свойств объекта.
console.log(user.lastName);
console.log(user.age);
console.log(user.gender);
Синтаксис квадратных скобок - []
Ключи в объектах это всегда строки или Symbol, сосредоточимся пока на строках. Как мы знаем строки не всегда могу состоять из одного слова в котором нет пробелов и как быть если нам нужно создать свойство в объекте имя которого будет состоять из 2х слов разделенных пробелами или вообще будет являться выражением. Для этого будем использовать [ ].
let student = {
firstName: 'John',
['last name']: 'Dou', // Имя свойства содержащее пробел
['student-' + 'age']: 30, // Вычисляемое имя свойства
}
console.log(student);
Получить значения этих свойств у нас просто так не получится. Если мы будем использовать синтаксис точки '.' то получим ошибку. Вместо этого будем использовать квадратные скобки [ ].
console.log(student.firstName) // Обычный способ
console.log(student['last name'])
console.log(student['student-age'])
Готово, теперь все работает!
Вложенные объекты
Также стоит понимать что если мы можем вкладывать примитивы в объекты, делая их значениями ключей, то аналогичным образом мы можем вкладывать и другим объекты.
const deepObject = {
name: 'Mazda',
model: '#1',
owner: {
firstName: 'John',
lastNam: 'Doe',
age: 12
}
}
console.log(deepObject)
Это простой пример, на самом деле вложенность может быть очень большой, важно понимать что так можно делать.
Array
array - массив данных, а также итерируемый объект, также относится к типу данных object. Ключи для элементов массива создаются автоматически и являются индексами, позицией элемента внутри массива.
Индексирование массива начинается с нуля.
const arr = ['John', 'Alice', 'Andrew', 'Antony'];
console.log(arr)
У массива есть длинна (length), это свойство содержит количество элементов массива.
console.log(arr.length);
Берем элементы по их индексу.
console.log(
arr[0], arr[1], arr[2], arr[3]
)
Если мы хотим гарантировано получить значение последнего элемента в массиве.
console.log(
arr[arr.length - 1]
)
В этом уроке мы не будем погружаться в массивы и их работу полностью, на данный момент стоит знать что массивы тоже относятся к типу данных object.
Функции
Функции - это участки кода которые можно переиспользовать, в этом уроке мы не будем их рассматривать подробно.
Для создания функции существует несколько способов ключевое слово function и стрелочный синтаксис.
function foo(a, b) {
return a + b;
}
const bar = (a, b) => {
return a - b;
}
console.log(foo);
console.log(bar);
Функции также являются объектами и относятся к типу данных object.
Файлы с урока
P.S. Подпишись на мой youtube и telegram канал чтобы регулярно получать новый контент.
