САМОСТОЯТЕЛЬНОЕ ОБУЧЕНИЕ ДЛЯ ВЕБ РАЗРАБОТЧИКОВ
×

JS Учебник

JS Главная JS Введение JS Где установить? JS Вывод JS Заявления JS Синтаксис JS Комментарии JS Переменные JS Let JS Const JS Операторы JS Арифметика JS Присваивание JS Типы данных JS Функции JS Объекты JS События JS Строки JS Методы строк JS Поиск строк JS Шаблоны строк JS Числа JS Методы чисел JS Массивы JS Методы массива JS Сортировка массива JS Итерация массива JS Постоянный массив JS Даты JS Формат дат JS Методы получения дат JS Методы набора дат JS Объекты Math JS Случайные числа JS Булевы JS Сравнения JS Оператор If...Else JS Оператор Switch JS Цикл For JS Цикл For In JS Цикл For Of JS Цикл While JS Оператор Break JS Повторяющиеся JS Наборы JS Карты JS Typeof JS Преобразование JS Битовые JS Выражения JS Ошибки JS Область JS Подъемный JS Строгий JS Ключевое слово this JS Стрелки JS Классы JS JSON JS Отладчик JS Стиль JS Практика JS Ошибки JS Эффективность JS Слова

JS Версии

JS Версии JS 2009 (ES5) JS 2015 (ES6) JS 2016 JS 2017 JS 2018 JS IE/Edge JS История

JS Объекты

Определение объекта Свойства объекта Методы объекта Отображение объекта Доступ объекта Конструкторы объекта Прототипы объекта Повторяющиеся объекты Набор объектов Карты объекта Справочник объектов

JS Функции

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

JS Классы

Введение класса Наследование класса Статистический класс

JS Асинхронный

JS Обратный вызов JS Асинхронный JS Обещания JS Асинхронный

JS HTML DOM

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

JS Браузер BOM

JS Window JS Экран JS Расположение JS История JS Навигатор JS Предупреждение JS Синхронизация JS Куки

JS Веб APIы

Веб API Введение Веб API История Веб API Хранилище Веб API Работник Веб API Извлечь Веб API Геолокации

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 Строки JSON Объекты JSON Массивы JSON PHP JSON HTML JSON JSONP

JS или jQuery

jQuery Селекторы jQuery Элементы jQuery CSS jQuery DOM

JS Примеры

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

JS Справочник

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


JavaScript Методы массива



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


JavaScript метод toString() преобразует массив в строку значений массива (разделенных запятыми):

Пример

var fruits = ["Банан", "Апельсин", "Яблоко", "Манго"];
document.getElementById("demo").innerHTML = fruits.toString();

Результат:

Банан,Апельсин,Яблоко,Манго
Попробуйте сами »

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

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

Пример

var fruits = ["Банан", "Апельсин", "Яблоко", "Манго"];
document.getElementById("demo").innerHTML = fruits.join(" * ");

Результат:

Банан * Апельсин * Яблоко * Манго
Попробуйте сами »

Выталкивание и толкать

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

Вот, что такое выталкивание и толкать:

Извлечение элементов из массива или перемещение элементов в массив.



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

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

Пример

var fruits = ["Банан", "Апельсин", "Яблоко", "Манго"];
fruits.pop();  // Удаляет последний элемент ("Манго") из fruits
Попробуйте сами »

Метод pop() возвращает значение, которое "выскочило":

Пример

var fruits = ["Банан", "Апельсин", "Яблоко", "Манго"];
var x = fruits.pop();  // значение x "Манго"
Попробуйте сами »

Толкать

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

Пример

var fruits = ["Банан", "Апельсин", "Яблоко", "Манго"];
fruits.push("Киви");  //Добавляет новый элемен ("Киви") к fruits
Попробуйте сами »

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

Пример

var fruits = ["Банан", "Апельсин", "Яблоко", "Манго"];
var x = fruits.push("Киви");  // значение x равно 5
Попробуйте сами »

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

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

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

Пример

var fruits = ["Банан", "Апельсин", "Яблоко", "Манго"];
fruits.shift();  // Удаляет первый элемент "Банан" из fruits
Попробуйте сами »

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

Пример

var fruits = ["Банан", "Апельсин", "Яблоко", "Манго"];
var x = fruits.shift();  // значение x равно "Банан"
Попробуйте сами »

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

Пример

var fruits = ["Банан", "Апельсин", "Яблоко", "Манго"];
fruits.unshift("Лимон");  // Добавляет новый элемент "Лимон" к fruits
Попробуйте сами »

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

Пример

var fruits = ["Банан", "Апельсин", "Яблоко", "Манго"];
fruits.unshift("Лимон");  // Возвращает 5
Попробуйте сами »

Смена элементов

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

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

Пример

var fruits = ["Банан", "Апельсин", "Яблоко", "Манго"];
fruits[0] = "Киви";   // Изменяет первый элемент фруктов на "Киви"
Попробуйте сами »

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

Пример

var fruits = ["Банан", "Апельсин", "Яблоко", "Манго"];
fruits[fruits.length] = "Киви";  // Добавляет "Киви" к фруктам
Попробуйте сами »

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

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

Пример

var fruits = ["Банан", "Апельсин", "Яблоко", "Манго"];
delete fruits[0];           // Изменяет первый элемент в фруктах на undefined
Попробуйте сами »

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


Объединение массива

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

Пример

var fruits = ["Банан", "Апельсин", "Яблоко", "Манго"];
fruits.splice(2, 0, "Лимон", "Киви");
Попробуйте сами »

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

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

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

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

Пример

var fruits = ["Банан", "Апельсин", "Яблоко", "Манго"];
fruits.splice(2, 2, "Лимон", "Киви");
Попробуйте сами »

Использование splice()

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

Пример

var fruits = ["Банан", "Апельсин", "Яблоко", "Манго"];
fruits.splice(0, 1);  // Удаляет первый элемент фруктов
Попробуйте сами »

Первый параметр (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 = ["Emil", "Tobias", "Linus"];
var myChildren = arr1.concat("Peter"); 
Попробуйте сами »

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

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

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

Пример

var fruits = ["Банан", "Апельсин", "Лимон", "Яблоко", "Манго"];
var citrus = fruits.slice(1);
Попробуйте сами »

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

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

Пример

var fruits = ["Банан", "Апельсин", "Лимон", "Яблоко", "Манго"];
var citrus = fruits.slice(3);
Попробуйте сами »

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

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

Пример

var fruits = ["Банан", "Апельсин", "Лимон", "Яблоко", "Манго"];
var citrus = fruits.slice(1, 3);
Попробуйте сами »

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

Пример

var fruits = ["Банан", "Апельсин", "Лимон", "Яблоко", "Манго"];
var citrus = fruits.slice(2);
Попробуйте сами »

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

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

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

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

Пример

var fruits = ["Банан", "Апельсин", "Яблоко", "Манго"];
document.getElementById("demo").innerHTML = fruits.toString();
Попробуйте сами »

Пример

var fruits = ["Банан", "Апельсин", "Яблоко", "Манго"];
document.getElementById("demo").innerHTML = fruits;
Попробуйте сами »

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


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

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

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


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

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


Полная ссылка на массив

Для получения полной справки перейдите к Справочнику по массивам JavaScript.

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


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

Упражнение:

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

var fruits = ["Банан", "Апельсин", "Яблоко"];
;

Упражнения