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

JavaScript справочникИтерацияМетод, выполняющий один раз операцию над каждым элементом массива, называется

методов массива.Итерацияметод тесно связан с циклами.

Array.forEach()

forEach()метод для выполнения предоставленной функции для каждого элемента массива (回调-функции).

Мы можем использоватьforEach()Вывод каждого элемента массива в документ.

var fruits = ["Apple", "Mango", "Banana", "Orange"];
var result = document.getElementById("result");
fruits.forEach(function(element, index, array) {
　　　　result.innerHTML += index + ": " + element + "<br>";
});

Обратите внимание, что функция принимает 3 параметра:

• Значение элемента (обязательно)

• Индекс элемента (по желанию)

• Сам массив (по желанию)

Поскольку два параметра (индекс, массив) являются опциональными, мы можем пропустить их:

var fruits = ["Apple", "Mango", "Banana", "Orange"];
var result = document.getElementById("result");
fruits.forEach(function(element) {
　　　　result.innerHTML += element + "<br>";
});

Array.map()

map()Метод возвращает новый массив, не изменяя исходный массив. В то же время элементы нового массива представляют собой значения элементов исходного массива, обработанные функцией, и обрабатываются элементы в порядке их следования в исходном массиве.

Внимание: функция map() не выполняет проверку на пустой массив.

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

var nums1 = [1, 5, 20, 14, 55, 16];
var nums2 = nums1.map(twice);
function twice(element, index, array) {
　　　return (element * 2);
}

Обратите внимание, что функция принимает 3 параметра:

• Значение элемента (обязательно)

• Индекс элемента (по желанию)

• Сам массив (по желанию)

Поскольку два параметра (индекс, массив) являются опциональными, мы можем пропустить их:

var nums1 = [1, 5, 20, 14, 55, 16];
var nums2 = nums1.map(twice);
function twice(element) {
　　　return (element * 2);
}

Array.filter()

filter()Это часто используемая операция в JavaScript Array, которая удаляет某些 элементы из массива и возвращает оставшиеся элементы. Основной принцип filter заключается в том, что функция передается каждому элементу по очереди, и на основе значения true или false, возвращаемого, решается, сохранять элемент или выбрасывать.

В следующем примере создается новый массив с элементами, равными или превышающими 18:

var age = [1, 30, 39, 29, 10, 13];
var val = age.filter(isAdult);
function isAdult(element, index, array) {
　　　　return element >= 18;
}

Обратите внимание, что функция принимает 3 параметра:

• Значение элемента (обязательно)

• Индекс элемента (по желанию)

• Сам массив (по желанию)

Поскольку два параметра (индекс, массив) являются опциональными, мы можем пропустить их:

var age = [1, 30, 39, 29, 10, 13];
var val = age.filter(isAdult);
function isAdult(element) {
　　　　return element >= 18;
}

Array.reduce()

reduce()Метод принимает функцию в качестве аккumulатора, каждый элемент массива (слева направо) уменьшается, в конечном итоге вычисляется в один значений.

Это очень распространено в числах, например, найти сумму всех чисел в массиве.

var nums = [10, 20, 30, 40, 50];
var sum = nums.reduce(getTotal);
function getTotal(x, y) {
　　　　return (x + y);
}

Обратите внимание, что функция принимает 4 параметра:

• Начальное значение/предыдущее возвращенное значение (обязательно)

• Значение элемента (обязательно)

• Индекс элемента (по желанию)

• Сам массив (по желанию)

Array.find()

find()Метод возвращает первый элемент в массиве, удовлетворяющем заданному условию.

В следующем примере мы найдем первый элемент, равный или превышающий 18:

var num = [1, 30, 39, 29, 10, 13];
var val = num.find(myFunc);
function myFunc(element) {
　　　　return element >= 18;
}

Обратите внимание, что функция принимает 3 параметра:

• Значение элемента (обязательно)

• Индекс элемента (по желанию)

• Сам массив (по желанию)

Array.findIndex()

findIndex()Метод возвращает первый индекс в массиве, удовлетворяющем заданному условию.

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

var num = [1, 30, 39, 29, 10, 13];
var val = num.findIndex(myFunc);
function myFunc(element) {
　　　　return element >= 18;
}

Обратите внимание, что функция принимает 3 параметра:

• Значение элемента (обязательно)

• Индекс элемента (по желанию)

• Сам массив (по желанию)

Array.every()

every()Метод используется для проверки,是否符合 заданным условиям все элементы массива (через функцию проверки).

В следующем примере проверяется, равны ли все значения массива или больше 18:

var nums = [1, 30, 39, 29, 10, 13];
var bool = nums.every(function(element) {
　　　　return element >= 18;
});
document.getElementById("result").innerHTML = bool;

Обратите внимание, что функция принимает 3 параметра:

• Значение элемента (обязательно)

• Индекс элемента (по желанию)

• Сам массив (по желанию)

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

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

Часть справки содержит описание и примеры всех свойств и методов массивов.