Массив в JavaScript — это упорядоченный набор данных, который может содержать несколько значений одного или разных типов. Это структура данных, которая используется для хранения набора элементов в одном месте.
Массивы создаются с помощью конструктора **`Array`** или нотации квадратных скобок (**`[]`**). Например:
// Using the Array constructor const arr1 = new Array("🍇","🍈","🍉","🍋","🍌"); // Using square brackets const arr2 = ["🍇","🍈","🍉","🍋","🍌"];
Вы можете получить доступ к элементам в массиве, используя их индексы, которые являются позициями элементов в массиве. Например, чтобы получить доступ ко второму элементу в массиве **`arr2`**, вы можете использовать следующий синтаксис:
console.log(arr2[1]); // Output: 🍈
Вы также можете изменить значения в массиве, назначив новые значения индексам. Например:
arr2[1] = "🍍"; // The second item in the array is now 🍍
Массивы в JavaScript имеют нулевой индекс, что означает, что первый элемент массива имеет индекс 0, второй элемент — индекс 1 и так далее.
В дополнение к хранению простых значений массивы также могут хранить сложные типы данных, такие как объекты или другие массивы.
const arr3 = [1, 'hello', [1, 2, 3], {key: 'value'}];
В JavaScript доступно множество методов для работы с массивами, например **`push`** для добавления элементов в конец массива, **`unshift`** для добавления элементов в начало массива и * *`splice`** для вставки или удаления элементов из массива. Я объясню некоторые важные методы массива JavaScript.
# Вставляем ****Элементы в массив JavaScript — array.push()****
Существует метод push для добавления элементов в массив JavaScript. Метод `push()` на самом деле является функцией метода, которая получает аргумент в виде элемента массива. Он всегда добавляет элементы в конец массива. Другой метод для выполнения той же операции с использованием `unshift` добавляет элементы в начало массива.
const winterFruits = [], // winter has come, now where is the fruit basket, let's fill it winterFruits.push("🍊") winterFruits.push("🥕") winterFruits.push("🍍") // print console.log(winterFruits) // ['🍊', '🥕', '🍍']
# ****Удалить элементы из массива в JS****
Существует метод pop для удаления элементов из массива JavaScript. метод `pop()` на самом деле является функцией метода, доступной в массиве. Он всегда удаляет элементы один за другим с конца существующего массива. Другой метод для выполнения той же операции с помощью `shift` добавляет элементы в начало массива. `pop` возвращает удаленный элемент.
Давайте съедим бургер,
const burgers = ['zinger stack 🍔', 'stack 🍔', 'mighty burger 🍔'] // try mighty bites, so remove it. burgers.pop() // so here is your: 'mighty burger 🍔' // how about other burgers eat one, for console.log(burgers) // I will like you to try zinger stack. I insist burgers.shift() // how was it? 'zinger stack 🍔'
# Измените массив JS, добавив, удалив и заменив элементы
Существует метод `splice` для добавления, удаления, замены элементов по определенному индексу. Он изменяет массив на месте и не создает новый массив. `splice()` — это функция метода JavaScript, которая позволяет передавать 3 основных аргумента с одним необязательным.
**Подробнее об аргументах объединения**
[Array.prototype.splice() — JavaScript | MDN](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/splice)
## Удалить элементы из массива с помощью склейки
В основном метод splice() используется для удаления элементов из массива. Он возвращает массив удаленных элементов и изменяет исходный массив.
```jsx
const array = ['porsche 911', 'TNT 150I', 'большой дом', 'disney plus', 'deezer hifi'];
//array.splice(startIndex , сколько элементов нужно удалить)
// выбираем число от 0 до 4
const CandyResponse = array.splice(2, 1); // удаляет элементы с индексом 2 ("большой дом") из массива и возвращает их
console.log(массив); // Вывод: [‘porsche 911’, ‘TNT 150I’, ‘disney plus’, ‘deezer hifi’]
console.log(candidateResponse); // Вывод: ['большой дом']
// кандидат выиграл большой красивый дом. хороший, попробуй свой.
```
## Добавляем элементы в массив с помощью склейки
Метод splice также можно использовать для добавления элементов в массив по определенному индексу. Посмотрим, как
```jsx
let tasks = ['Вынести мусор', 'Помыть посуду', 'Покосить газон'];
tasks.splice(0, 0, «Купить продукты»); // добавляет новую задачу по индексу 0, не удаляя никаких элементов
console.log(задачи); // Вывод: ["Купить продукты", "Вынести мусор", "Помыть посуду", "Покосить газон"]
```
**Практический пример**
```jsx
let items = ["яблоко", "банан", "вишня"];
// Получить новый элемент из поля ввода
let newItem = document.getElementById(“new-item-input”).value;
// Добавляем новый элемент в список
items.splice(items.length, 0, newItem);
// Обновить дисплей, чтобы отобразить новый список
updateListDisplay(items);
```
**Примечание.** Это всегда элементы после определенного индекса.
## Замена элементов в массиве с помощью сплайсинга
Метод splice может заменять элементы в массиве. Он удаляет элементы и добавляет элементы по определенному индексу.
```jsx
// синтаксис
array.splice(startIndex, deleteCount, element1, element2, …);
```
```jsx
let array = [1, 2, 3, 4, 5];
пусть удалено = array.splice(2, 2, 6, 7); // удаляются элементы с индексами 2 и 3 (3 и 4) и заменяются на 6 и 7
console.log(массив); // Вывод: [1, 2, 6, 7, 5]
console.log(удалено); // Вывод: [3, 4]
```
# Сортировка элементов массива JavaScript
Метод **`sort`** — это встроенная функция JavaScript, позволяющая сортировать элементы массива на месте. Он изменяет исходный массив и не создает новый массив.
Вот пример использования метода **`sort`** для сортировки элементов массива в порядке возрастания:
```jsx
let array = [3, 5, 1, 2, 4];
массив.сортировать(); // сортирует массив по возрастанию
console.log(массив); // Вывод: [1, 2, 3, 4, 5]
```
## Сортировка товаров с помощью JavaScript
Почему бы не взглянуть на реальный сценарий?
```jsx
let products = [
{ название: «Товар А», цена: 50 },
{ название: «Товар Б», цена: 20 },
{ название: «Товар C», цена: 30 },
{ название: «Товар D», цена: 10 },
];
products.sort((a, b) =› {
return a.price — b.price;
});
console.log(products);
// Вывод:
// [
// { name: «Товар D», price: 10 },
// { name: «Товар Б», цена: 20 },
// { название: «Товар С», цена: 30 },
// { название: «Товар А», цена: 50 }
// ]
I;
```
Другой способ сортировки — использование алгоритма сортировки. Объясняется здесь.
# Как перевернуть массив в JavaScript
Чтобы перевернуть массив в JavaScript, вы можете использовать метод **`reverse`**, предоставляемый объектом Array. Метод **`reverse`** изменяет исходный массив на месте и не создает новый массив.
```jsx
let array = [1, 2, 3, 4, 5];
массив.реверс();
console.log(массив); // Вывод: [5, 4, 3, 2, 1]
```
# Заключительные замечания
Вы только что узнали о 3–4 методах массива JavaScript. Массив — это широко используемая структура данных при создании интерфейсных и серверных приложений. Когда массив используется для хранения больших и сложных данных, требуются методы обработки данных для сортировки, удаления и добавления новых данных. Таким образом, массив в целом очень полезен и прост для понимания с кучей решений для решения проблем.