Объекты в JavaScript. Что такое массив объектов? Создание массива объектов

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

Как вам хорошо известно, в JavaScript существуют разные типы данных. 7 из них являются примитивными, ведь они содержат лишь одно значение, причём неважно, строка это, число, либо что-нибудь иное. Пришло время поговорить и про объекты. Они применяются в JavaScript, например, в целях хранения коллекций разных значений, а также каких-нибудь сложных сущностей. В целом они используются довольно часто, и это особенность языка. Разумеется, мы должны их понимать.

Синтаксис создания объекта

Объект можно создать, используя фигурные скобки {…} с необязательным перечнем свойств. В нашем случае свойство является парой «ключ: значение», причём ключ здесь – это строка (называется ещё «именем свойства»), а вот уже значение бывает чем угодно.

Давайте представим объект в форме ящика, где лежат подписанные папки. Таким образом, каждый элемент данных лежит в своей папке, а на той папке написан ключ. Раз есть ключ, папку можно без проблем найти, и не только найти, но ещё удалить либо добавить что-нибудь в неё.

Создадим пустой ящик объект в JavaScript, что можно сделать, используя один из 2-х вариантов синтаксиса:

let user = new Object(); // синтаксис "конструктор объекта"
let user = {};  // синтаксис "литерал объекта", литеральный синтаксис

Как правило, используется вариант с фигурными скобками {...}. В этом случае объявление называют литералом объекта либо литеральной нотацией.

Особенности литералов и их свойства

Когда мы используем литеральный синтаксис {...}, у нас есть возможность помещать в объект сразу несколько свойств, соответственно, используя пары «ключ: значение»:

let user = {     // объект
  name: "Bob",  // под ключом "name" сохраняется значение "Bob"
  age: 50        // под ключом "age" сохраняется значение 50
};

Свойства объекта в JavaScript иногда называют поля объекта.

Идём далее. Каждое свойство имеет ключ («имя» либо «идентификатор»). После имени/идентификатора свойства идёт двоеточие ":", потом указывается значение свойства. Когда в объекте есть несколько свойств, они перечисляются через запятую.

В объекте user у нас находятся 2 свойства: 1. Свойство с именем "name" и, соответственно, значением "Bob". 2. Свойство с именем "age" и, соответственно, значением 50.

Мы можем предположить, что объект user – это не что иное, как ящик с 2-мя папками, которые подписаны «name» и «age». Также у нас есть возможность добавить в ящик новые папки в любой момент. Либо удалить их. Или же прочитать содержимое.

Чтобы обратиться к свойствам воспользуемся записью «через точку»:

// получение свойств объекта:
alert( user.name ); // Bob
alert( user.age ); // 50

Значение способно быть любого типа. Попробуем добавить свойство, имеющее логическое значение:

user.isAdmin = true;

А чтобы удалить свойства, нам пригодится оператор delete:

delete user.age;

Что касается имени свойства, то оно может включать в себя несколько слов, но в этом случае оно должно заключаться в кавычки:

let user = {
  name: "Bob",
  age: 50,
  "likes birds": true  // имя свойства из нескольких слов в кавычках
};

Последнее свойство объекта может оканчиваться запятой:

 let user = {
  name: "Bob",
  age: 50,
}

Что это за «висячая запятая»? На самом деле, она здесь не просто так. Реализованный подход упростит добавление, перемещение и удаление свойств в JavaScript, ведь все строки нашего объекта становятся одинаковыми.

Создаём массив объектов

Теперь давайте поговорим о том, как реализовать создание массива из объектов в JavaScript. Но для начала создадим объект с помощью специального метода:

    var myNewObject = {
    key1: value1,
    key2: value2,
    ...
}

Кстати, для этих целей существуют и другие методы:

    /* создаём пустой объект */
var emptyObject = new Object();

var someObject = new Object( {0:"one", 1:"two"} );
/* получаем объект someObject, 
у которого заданы key:value 
    0: "one",
    1: "two"
*/

var fullObject = new Object( {first : "one", second : "two"} );
/* получаем объект fullObject, 
у которого заданы key:value 
    first: "one",
    second: "two"
*/

Кроме того, мы можем задать ключи и значения объектов, если обратимся к нашим объектам в JavaScript, как к ассоциативному массиву:

    var customObject = new Object();

customObject["id"] = "1";
customObject["name"] = "goodObject";

/* На выходе будет объект customObject:
    id: "1",
    name: "goodObject"
*/

Переходим непосредственно к созданию массива объектов:

    var arrObjects = []; // объявляем массив

arrObjects[0] = {
    id: "1",
    name: "firstArrElement"
}
arrObjects[1] = {
    id: "2",
    name: "secondArrElement"
}

/* На выходе мы получим массив из 2 объектов, у которых заданы id и name */

Вот и всё! Более продвинутые навыки вы всегда сможете получить на наших курсах!

При подготовке статьи использовались следующие материалы:

• "Объекты";
• "Создание объектов и массива объектов в JavaScript".