Основні відмінності між масивами та літералами об’єктів у JavaScript

Літерали об'єктів

Об'єкти зберігають колекції різних даних у форматі ключ-значення, наприклад:

{ name: “Clarisse” }.

Тут ключ — це name, а значення — “Clarisse”. Ключ використовується пізніше, коли потрібно отримати дані, які до нього прив'язані. Об'єкт можна створити за допомогою фігурних дужок {…} з необов'язковим списком властивостей, і вони повинні бути у форматі ключ-значення, як зазначено раніше. Коли використовуються фігурні дужки, така декларація називається літералом об'єкта.

Візуально це можна уявити як набір файлів, що зберігаються в коробці. Кожен файл містить дані, прив'язані до певного ключа. Це полегшує пошук файлу за його іменем або додавання/видалення файлів.

Щодо JavaScript, приклад буде показано нижче

let test = {   
name: "John" // за ключем "name" зберігається значення "John",  

age: 20, // за ключем "age" зберігається значення 20}   

// для зберігання об'єкта потрібно створити змінну.

Значення властивостей доступні через нотацію крапки

//отримати значення властивостей об'єкта  
alert(test.name); // John  
alert(test.age); // 20

Масиви

Масиви зберігають колекції в упорядкованому форматі, тобто дані зберігаються в списку, де є 1-й елемент, 2-й елемент і так далі. На відміну від літералів об'єктів, масиви мають методи, які можна використовувати для управління порядком елементів або для вставки нової "властивості" між існуючими. Масиви зберігаються за допомогою квадратних дужок, тобто []. Вони використовуються для зберігання упорядкованих колекцій.

Створення порожнього масиву в JavaScript:

let test = []; //створено порожній масив.

Ми можемо додавати елементи до цього масиву.

let test = ["milk", "bread", "biscuits", "candy"];  
alert(test[0]); //milk  
alert(test[1]); //bread  
alert(test[2]); //biscuits  
alert(test[3]); //candy

Елемент можна замінити, наприклад:

test[2] = "almonds", // тепер ["milk", "bread", "almonds", "candy"];

Також можна додати новий елемент:

test[4] = "taffy" //тепер ["milk", "bread", "biscuits", "candy", "taffy"];

Оскільки масиви є упорядкованими колекціями елементів, існують різні методи, які можна використовувати для перерозподілу або видалення елементів за потребою. Це:

1. push: Додає елемент в кінець масиву.
2. shift: Видаляє елемент з початку, тому 2-й елемент стає 1-м.
3. pop: Видаляє елемент з кінця масиву.
4. unshift: Додає елемент на початок масиву.

Ці методи продемонстровані в прикладах нижче:

let test = ["milk", "bread", "biscuits", "candy", "taffy"];  

alert(test.pop()); // видаляє "taffy" і виводить його  
alert(test); // ["milk", "bread", "biscuits", "candy"]

let test = ["milk", "bread", "biscuits", "candy"];  

test.push("taffy"); // додає "taffy" в кінець  
alert(test); // ["milk", "bread", "biscuits", "candy", "taffy"]

let test = ["milk", "bread", "biscuits", "candy", "taffy"];  

alert(test.shift()); // видаляє "milk" і виводить його  
alert(test); // ["bread", "biscuits", "candy", "taffy"]

let test = ["bread", "biscuits", "candy", "taffy"];  

test.unshift("milk"); // додає "milk" на початок  
alert(test); // ["milk", "bread", "biscuits", "candy", "taffy"]

Сподіваюся, ця стаття допомогла виділити основні відмінності між масивами та літералами об'єктів. Дякую за увагу.

Перекладено з: Core Differences between Arrays and Object Literals in JavaScript