ЛУЧШИЙ САЙТ ДЛЯ ВЕБ-РАЗРАБОТЧИКОВ

JS Учебник

JS Старт JS Введение JS Установка JS Вывод JS Объявления JS Синтаксис JS Комментарии JS Переменные JS Операторы JS Арифметические JS Присваивание JS Типы данных JS Функции JS Объекты JS События JS Строки JS Методы строки JS Числа JS Методы числа JS Массивы JS Методы массива JS Сортировка массива JS Итерация массива JS Даты JS Форматы дат JS Методы получения дат JS Методы установки дат JS Математические JS Рандомные JS Булевы JS Сравнения JS Условия JS Switch JS Цикл For JS Цикл While JS Прерывание JS Преобразование типов JS Побитовые JS Регулярные выражения JS Ошибки JS Область действия JS Подъём JS Строгий режим JS Ключевое слово this JS Ключевое слово Let JS Ключевое слово Const JS Функции стрелок JS Классы JS Отладка JS Гид по стилю JS Лучшие практики JS Ошибки JS Производительность JS Зарезервированные слова JS Версии JS Версия ES5 JS Версия ES6 JS JSON

JS Формы

JS Формы Формы API

JS Объекты

Определения объектов Свойства объекта Методы объекта Доступ к объектам Конструкторы объектов Прототипы объектов Объект ECMAScript 5

JS Функции

Определения функций Параметры функции Обращение к функции Вызов функции Применение функции Закрытие функции

JS HTML DOM

DOM Введение DOM Методы DOM Документ DOM Элементы DOM HTML DOM CSS DOM Анимация DOM События DOM Слушатель событий DOM Навигация DOM Узлы DOM Коллекции DOM Узловые списки

JS Объектная модель браузера BOM

JS Окно JS Скрин JS Локация JS История JS Навигатор JS Всплывающее оповещение JS Тайминг JS Куки

JS AJAX

AJAX Введение AJAX XMLHttp AJAX Запрос AJAX Отклик AJAX XML Файл AJAX PHP AJAX ASP AJAX База данных AJAX Приложения AJAX Примеры

JS JSON

JSON Введение JSON Синтаксис JSON и XML JSON Типы данных JSON Анализ JSON Stringify JSON Объекты JSON Массивы JSON PHP JSON HTML JSON JSONP

JS и jQuery

jQuery Селекторы jQuery HTML jQuery CSS jQuery DOM

JS Примеры

JS Примеры JS HTML DOM JS HTML Input JS HTML Объекты JS HTML События JS Броузер JS Упражнения JS Викторина JS Сертификат

JS Справочники

JavaScript Объекты HTML DOM Объекты

JavaScript. Уроки для начинающих

JavaScript Array Methods / Методы Массива


Преобразование массивов в строки

JavaScript метод toString() преобразует массив в строку значений массива (через запятую).

Пример

var fruits = ["Banana", "Orange", "Apple", "Mango"];
document.getElementById("demo").innerHTML = fruits.toString();

Результат:

Banana,Orange,Apple,Mango
Попробуйте сами »

Метод join() также объединяет все элементы массива в строку.

Он ведет себя так же, как toString(), но кроме того, вы можете указать разделитель:

Пример

var fruits = ["Banana", "Orange", "Apple", "Mango"];
document.getElementById("demo").innerHTML = fruits.join(" * ");

Результат:

Banana * Orange * Apple * Mango
Попробуйте сами »

Popping и Pushing / Выталкивание и вставка

Когда вы работаете с массивами, легко удалять элементы и добавлять новые элементы.

Это то, что выталкивается и вставляется:

Выталкивание элементов наружу из массива, или вставка элементов внутрь массива.


Popping / Выталкивание

Метод pop() удаляет последний элемент из массива:

Пример

var fruits = ["Banana", "Orange", "Apple", "Mango"];
fruits.pop();              // Удаляет последний элемент ("Mango") из fruits
Попробуйте сами »

Метод pop() метод возвращает значение, которое было "popped out" (внезапно удалено):

Пример

var fruits = ["Banana", "Orange", "Apple", "Mango"];
var x = fruits.pop();      // the value of x is "Mango"
Попробуйте сами »

Pushing / Вставка

Метод push() добавляет новый элемент в массив (в конце):

Пример

var fruits = ["Banana", "Orange", "Apple", "Mango"];
fruits.push("Kiwi");       //  Добавляет новый элемент ("Kiwi") в fruits
Попробуйте сами »

Метод push() возвращает новую длину массива:

Пример

var fruits = ["Banana", "Orange", "Apple", "Mango"];
var x = fruits.push("Kiwi");   //  значение х составляет 5
Попробуйте сами »

Сдвиг элементов

Сдвиг эквивалентен выталкиванию, работая с первым элементом вместо последнего.

Метод shift() удаляет первый элемент массива и "сдвигает" все остальные элементы к более низкому индексу.

Пример

var fruits = ["Banana", "Orange", "Apple", "Mango"];
fruits.shift();            // Удаляет первый элемент "Banana" из fruits
Попробуйте сами »

Метод shift() возвращает строку, которая была "сдвинута":

Пример

var fruits = ["Banana", "Orange", "Apple", "Mango"];
var x = fruits.shift();    // значение x будет "Banana"
Попробуйте сами »

Метод unshift() добавляет новый элемент в массив (в начале), и "передвигает" старые элементы:

Пример

var fruits = ["Banana", "Orange", "Apple", "Mango"];
fruits.unshift("Lemon");    // Добавляет новый элемент "Lemon" к fruits
Попробуйте сами »

Метод unshift() возвращает новую длину массива.

Пример

var fruits = ["Banana", "Orange", "Apple", "Mango"];
fruits.unshift("Lemon");    // Возвращает 5
Попробуйте сами »

Изменение элементов

Доступ к элементам массива осуществляется с использованием их номера индекса:

Массив indexes начинается с 0. [0] является первым элементом массива, [1] - это второй элемент массива, [2] - это третий элемент массива и т.д. ...

Пример

var fruits = ["Banana", "Orange", "Apple", "Mango"];
fruits[0] = "Kiwi";        // Изменяет первый элемент из fruits на "Kiwi"
Попробуйте сами »

Свойство length обеспечивает простой способ добавить новый элемент в массив:

Пример

var fruits = ["Banana", "Orange", "Apple", "Mango"];
fruits[fruits.length] = "Kiwi";          // Присоединяет "Kiwi" к fruits
Попробуйте сами »

Удаление элементов

Поскольку массивы JavaScript являются объектами, элементы можно удалять с помощью JavaScript оператора delete:

Пример

var fruits = ["Banana", "Orange", "Apple", "Mango"];
delete fruits[0];           // Изменяет первый элемент в fruits на undefined
Попробуйте сами »

Использование delete может оставить неопределенные дыры в массиве. Вместо этого используйте pop() или shift().


Сращивание массива

Метод splice() можно использовать для добавления новых элементов в массив:

Пример

var fruits = ["Banana", "Orange", "Apple", "Mango"];
fruits.splice(2, 0, "Lemon", "Kiwi");
Попробуйте сами »

Первый параметр (2) определяет позицию где новые элементы должны быть добавлены (вставлены).

Второй параметр (0) определяет сколько элементов должно быть удалено.

Остальные параметры ("Lemon", "Kiwi") определяют новые элементы, которые будут добавлены.

Метод splice() возвращает массив с удаленными элементами:

Пример

var fruits = ["Banana", "Orange", "Apple", "Mango"];
fruits.splice(2, 2, "Lemon", "Kiwi");
Попробуйте сами »

Использование splice() для удаления элементов

При умной установке параметров вы можете использовать splice() для удаления элементов, не оставляя "дыр" в массиве:

Пример

var fruits = ["Banana", "Orange", "Apple", "Mango"];
fruits.splice(0, 1);        // Удаляет первый элемент из fruits
Попробуйте сами »

Первый параметр (0) определяет позицию, в которой новые элементы должны быть добавлены (сращены).

Второй параметр (1) определяет сколько элементов должно быть удалено.

Остальные параметры опущены. Новые элементы не будут добавлены.


Объединение (конкатенация) массивов

Метод concat() создает новый массив путем объединения (конкатенации) существующих массивов:

Пример объединения (слияния) двух массивов

var myGirls = ["Cecilie", "Lone"];
var myBoys = ["Emil", "Tobias", "Linus"];
var myChildren = myGirls.concat(myBoys);   // Объединяет (конкатенирует) myGirls и myBoys
Попробуйте сами »

Метод concat() не меняет существующие массивы. Всегда возвращает новый массив.

Метод concat() может принимать любое количество аргументов массива:

Пример (Объединение трёх массовов)

var arr1 = ["Cecilie", "Lone"];
var arr2 = ["Emil", "Tobias", "Linus"];
var arr3 = ["Robin", "Morgan"];
var myChildren = arr1.concat(arr2, arr3);   // Объединяет arr1 с arr2 и arr3
Попробуйте сами »

Метод concat() также может принимать значения в качестве аргументов:

Пример (Слияние массива со значениями)

var arr1 = ["Cecilie", "Lone"];
var myChildren = arr1.concat(["Emil", "Tobias", "Linus"]); 
Попробуйте сами »

Нарезка массива

Метод slice() нарезает кусок массива в новый массив.

Этот пример вырезает часть массива, начиная с элемента 1 ("Orange") массива:

Пример

var fruits = ["Banana", "Orange", "Lemon", "Apple", "Mango"];
var citrus = fruits.slice(1);
Попробуйте сами »

Метод slice() создает новый массив. Он не удаляет какие-либо элементы из исходного массива.

Этот пример вырезает часть массива, начиная с элемента 3 ("Apple") массива:

Пример

var fruits = ["Banana", "Orange", "Lemon", "Apple", "Mango"];
var citrus = fruits.slice(3);
Попробуйте сами »

Метод slice() может принимать два аргумента, такие как slice(1, 3).

Затем метод выбирает элементы из начального аргумента и до (но не включая) конечного аргумента.

Пример

var fruits = ["Banana", "Orange", "Lemon", "Apple", "Mango"];
var citrus = fruits.slice(1, 3);
Попробуйте сами »

Если конечный аргумент пропущен, как в первых примерах, метод slice() вырезает остальную часть массива.

Пример

var fruits = ["Banana", "Orange", "Lemon", "Apple", "Mango"];
var citrus = fruits.slice(2);
Попробуйте сами »

Автоматический toString()

JavaScript автоматически преобразует массив в строку, разделенную запятыми, когда ожидается примитивное значение.

Это всегда тот случай, когда вы пытаетесь вывести массив.

Эти два примера приведут к одному и тому же результату:

Пример

var fruits = ["Banana", "Orange", "Apple", "Mango"];
document.getElementById("demo").innerHTML = fruits.toString();
Попробуйте сами »

Пример

var fruits = ["Banana", "Orange", "Apple", "Mango"];
document.getElementById("demo").innerHTML = fruits;
Попробуйте сами »

Все JavaScript объекты имеют метод toString().


Нахождение максимальных и минимальных значений в массиве

Нет встроенных функций для поиска наибольшего или наименьшего значения в массиве JavaScript.

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


Сортировка массивов

Сортировка массивов описана в следующей главе этого учебника.


Полный справочник Массивов

Для более полного ознакомления посетите Полный справочник JavaScript массивов.

Справочник содержит описания и примеры всех свойств и методов массива.


Проверьте себя с помощью упражнений

Упражнение:

Используйте корректный метод массива, чтобы удалить последний элемент из массива fruits.

var fruits = ["Banana", "Orange", "Apple"];
;

Начать упражнение