JavaScript Итерация массива
Методы итерации массива работают с каждым элементом массива.
Array.forEach()
Метод forEach() вызывает функцию (функцию обратного вызова) один раз для каждого элемента массива.
Пример
const numbers = [45, 4, 9, 16, 25];
let txt = "";
numbers.forEach(myFunction);
function myFunction(value, index, array) {
txt += value + "<br>";
}
Попробуйте сами »
Обратите внимание, что функция принимает 3 аргумента:
- Значение элемента
- Индекс элемента
- Сам массив
В приведенном выше примере используется только параметр значения. Пример можно переписать так:
Пример
const numbers = [45, 4, 9, 16, 25];
let txt = "";
numbers.forEach(myFunction);
function myFunction(value) {
txt += value + "<br>";
}
Попробуйте сами »
Array.map()
Метод map() создает новый массив, выполняя функцию для каждого элемента массива.
Метод map() не выполняет функцию для элементов массива без значений.
Метод map() не изменяет исходный массив.
В этом примере каждое значение массива умножается на 2:
Пример
const numbers1 = [45, 4, 9, 16, 25];
const numbers2 = numbers1.map(myFunction);
function myFunction(value, index, array) {
return value * 2;
}
Попробуйте сами »
Обратите внимание, что функция принимает 3 аргумента:
- Значение элемента
- Индекс элемента
- Сам массив
Когда функция обратного вызова использует только параметр значения, параметры индекса и массива можно не указывать:
Пример
const numbers1 = [45, 4, 9, 16, 25];
const numbers2 = numbers1.map(myFunction);
function myFunction(value) {
return value * 2;
}
Попробуйте сами »
Array.filter()
Метод filter() создает новый массив с элементами массива, который проходит проверку.
В этом примере создается новый массив из элементов со значением больше 18:
Пример
const numbers = [45, 4, 9, 16, 25];
const over18 = numbers.filter(myFunction);
function myFunction(value, index, array) {
return value > 18;
}
Попробуйте сами »
Обратите внимание, что функция принимает 3 аргумента:
- Значение элемента
- Индекс элемента
- Сам массив
В приведенном выше примере функция обратного вызова не использует параметры индекса и массива, поэтому их можно не указывать:
Пример
const numbers = [45, 4, 9, 16, 25];
const over18 =
numbers.filter(myFunction);
function myFunction(value) {
return value > 18;
}
Попробуйте сами »
Array.reduce()
Метод reduce() запускает функцию для каждого элемента массива для создания (уменьшения до) одного значения.
Метод reduce() работает в массиве слева направо. Смотрите также reduceRight().
Метод reduce() не уменьшает исходный массив.
Этот пример находит сумму всех чисел в массиве:
Пример
const numbers = [45, 4, 9, 16, 25];
let sum = numbers.reduce(myFunction);
function myFunction(total, value, index, array) {
return total + value;
}
Попробуйте сами »
Обратите внимание, что функция принимает 4 аргумента:
- Итого (начальное значение / ранее возвращенное значение)
- Значение элемента
- Индекс элемента
- Сам массив
В приведенном выше примере не используются параметры индекса и массива. Его можно переписать на:
Пример
const numbers = [45, 4, 9, 16, 25];
let sum = numbers.reduce(myFunction);
function myFunction(total, value) {
return total + value;
}
Попробуйте сами »
Метод reduce() может принимать начальное значение:
Пример
const numbers = [45, 4, 9, 16, 25];
let sum = numbers.reduce(myFunction, 100);
function myFunction(total, value) {
return total + value;
}
Попробуйте сами »
Array.reduceRight()
Метод reduceRight() запускает функцию для каждого элемента массива для создания (уменьшения до) одного значения.
Метод reduceRight() работает в массиве справа налево. Смотрите также reduce().
Метод reduceRight() не уменьшает исходный массив.
Этот пример находит сумму всех чисел в массиве:
Пример
const numbers = [45, 4, 9, 16, 25];
let sum = numbers1.reduceRight(myFunction);
function myFunction(total, value, index, array) {
return total + value;
}
Попробуйте сами »
Обратите внимание, что функция принимает 4 аргумента:
- Итого (начальное значение / ранее возвращенное значение)
- Значение элемента
- Индекс элемента
- Сам массив
В приведенном выше примере не используются параметры индекса и массива. Его можно переписать на:
Пример
const numbers = [45, 4, 9, 16, 25];
let sum = numbers1.reduceRight(myFunction);
function myFunction(total, value) {
return total + value;
}
Попробуйте сами »
Array.every()
Метод every() проверяет, все ли значения массива проходят тест.
В этом примере проверяется, все ли значения массива больше 18:
Пример
const numbers = [45, 4, 9, 16, 25];
let allOver18 =
numbers.every(myFunction);
function myFunction(value, index, array) {
return
value > 18;
}
Попробуйте сами »
Обратите внимание, что функция принимает 3 аргумента:
- Значение элемента
- Индекс элемента
- Сам массив
Когда функция обратного вызова использует только первый параметр (значение), остальные параметры можно не указывать:
Пример
const numbers = [45, 4, 9, 16, 25];
let allOver18 =
numbers.every(myFunction);
function myFunction(value) {
return
value > 18;
}
Попробуйте сами »
Array.some()
Метод some() проверяет, проходят ли некоторые значения массива тест.
В этом примере проверяется, не превышают ли некоторые значения массива 18:
Пример
const numbers = [45, 4, 9, 16, 25];
let someOver18 = numbers.some(myFunction);
function myFunction(value, index, array) {
return
value > 18;
}
Попробуйте сами »
Обратите внимание, что функция принимает 3 аргумента:
- Значение элемента
- Индекс элемента
- Сам массив
Array.indexOf()
Метод indexOf() ищет в массиве значение элемента и возвращает его позицию.
Примечание: Первый элемент имеет позицию 0, второй элемент - позицию 1 и т.д.
Пример
Искать элемент в массиве "Apple":
const fruits = ["Apple", "Orange", "Apple", "Mango"];
let position = fruits.indexOf("Apple") + 1;
Попробуйте сами »
Синтаксис
array.indexOf(item, start)
| item | Обязательно. Элемент для поиска. |
| start | По желанию. С чего начать поиск. Отрицательные значения начнутся в данной позиции, считая от конца, и поиск до конца. |
Array.indexOf() возвращает -1, если элемент не найден.
Если элемент присутствует более одного раза, он возвращает позицию первого вхождения.
Array.lastIndexOf()
Array.lastIndexOf() то же самое, что и Array.indexOf(), но возвращает позицию последнего вхождения указанного элемента.
Пример
Искать элемент в массиве "Apple":
const fruits = ["Apple", "Orange", "Apple", "Mango"];
let position = fruits.lastIndexOf("Apple") + 1;
Попробуйте сами »
Синтаксис
array.lastIndexOf(item, start)
| item | Обязательно. Элемент для поиска |
| start | По желанию. С чего начать поиск. Отрицательные значения будут начинаться с данной позиции, считая от конца, и поиск до начала. |
Array.includes()
ECMAScript 2016 представил массивы Array.includes() Это позволяет нам проверить, присутствует ли элемент в массиве (включая NaN, в отличие от indexOf).
Пример
const fruits = ["Banana", "Orange", "Apple", "Mango"];
fruits.includes("Mango"); // является true
Попробуйте сами »
Синтаксис
array.includes(search-item)
Array.includes() позволяет проверять значения NaN. В отличие от Array.indexOf().
Array.includes() не поддерживается в Internet Explorer и Edge 12/13.
Первые версии браузеров с полной поддержкой:
| Chrome 47 | Edge 14 | Firefox 43 | Safari 9 | Opera 34 |
| Des 2015 | Aug 2016 | Des 2015 | Oct 2015 | Des 2015 |
Array.find()
Метод find() возвращает значение первого элемента массива, который передает тестовую функцию.
В этом примере находит (возвращает значение) первый элемент, размер которого больше 18:
Пример
const numbers = [4, 9, 16, 25, 29];
let first = numbers.find(myFunction);
function myFunction(value, index, array) {
return value > 18;
}
Попробуйте сами »
Обратите внимание, что функция принимает 3 аргумента:
- Значение элемента
- Индекс элемента
- Сам массив
Array.find() не поддерживается в старых версиях браузеров. Первые версии браузеров с полной поддержкой:
| Chrome 45 | Edge 12 | Firefox 25 | Safari 8 | Opera 32 |
| Sep 2015 | Aug 2015 | Oct 2013 | Oct 2014 | Sep 2015 |
Array.findIndex()
Метод findIndex() возвращает индекс первого элемента массива, который передает тестовую функцию.
В этом примере выполняется поиск индекса первого элемента, который больше 18:
Пример
const numbers = [4, 9, 16, 25, 29];
let first =
numbers.findIndex(myFunction);
function myFunction(value, index, array) {
return
value > 18;
}
Попробуйте сами »
Обратите внимание, что функция принимает 3 аргумента:
- Значение элемента
- Индекс элемента
- Сам массив
Array.findIndex() не поддерживается в старых версиях браузеров. Первые версии браузеров с полной поддержкой:
| Chrome 45 | Edge 12 | Firefox 25 | Safari 8 | Opera 32 |
| Sep 2015 | Aug 2015 | Oct 2013 | Oct 2014 | Sep 2015 |
Array.from()
Метод Array.from() возвращает объект Array из любого объекта со свойством length или любого итеративного объекта.
Array.Keys()
Метод Array.keys() возвращает объект Array Iterator с ключами массива.
Пример
Создайте объект Array Iterator, содержащий ключи массива:
const fruits = ["Banana", "Orange", "Apple", "Mango"];
const keys = fruits.keys();
for (let of keys) {
text += x + "<br>";
}
Попробуйте сами »
Полный справочник массивов
Для получения полной справки перейдите в Полный справочник JavaScript массив на нашем сайте W3Schools на русском.
Справочник содержит описания и примеры всех свойств и методов массива.
