Перебирающие методы массива

Перебирающие методы массива взаимодействуют с каждым элементом массива.

Array.forEach()

Метод forEach() единожды вызывает функцию обратного вызова для каждого элемента массива.

var txt = "";
var numbers = [45, 4, 9, 16, 25];
numbers.forEach(myFunction);

function myFunction(value, index, array) {
   txt = txt + value + "<br>"; 
} 

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

• Значение элемента (value)
• Индекс элемента (index)
• Сам массив (array)

В предыдущем примере в функции обратного вызова используется только параметр со значением элемента value. Этот пример можно переписать следующим образом:

var txt = "";
var numbers = [45, 4, 9, 16, 25];
numbers.forEach(myFunction);

function myFunction(value) {
   txt = txt + value + "<br>"; 
} 

Метод Array.forEach() поддерживается всеми браузерами за исключением Internet Explorer 8 и более ранних версий.

Array.map()

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

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

Метод map() не изменяет оригинальный массив.

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

var numbers1 = [45, 4, 9, 16, 25];
var numbers2 = numbers1.map(myFunction);

function myFunction(value, index, array) {
   return value * 2;
} 

Функция обратного вызова принимает 3 параметра:

• Значение элемента (value)
• Индекс элемента (index)
• Сам массив (array)

Если в функции обратного вызова используется только первый параметр value, то параметры index и array могут быть опущены:

var numbers1 = [45, 4, 9, 16, 25];
var numbers2 = numbers1.map(myFunction);

function myFunction(value) {
   return value * 2;
} 

Метод Array.map() поддерживается всеми браузерами за исключением Internet Explorer 8 и более ранних версий.

Array.filter()

Метод filter() создает новый массив с элементами исходного массива, прошедшими заданную проверку.

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

var numbers = [45, 4, 9, 16, 25];
var over18 =  numbers.filter(myFunction);

function myFunction(value, index, array) {
  return value > 18;
} 

Функция обратного вызова принимает 3 параметра:

• Значение элемента (value)
• Индекс элемента (index)
• Сам массив (array)

В предыдущем примере в функции обратного вызова не используются параметры index и array, поэтому их можно опустить:

var numbers = [45, 4, 9, 16, 25];
var over18 =  numbers.filter(myFunction);

function myFunction(value) {
  return value > 18;
} 

Метод Array.filter() поддерживается всеми браузерами за исключением Internet Explorer 8 и более ранних версий.

Array.reduce()/Array.reduceRight()

Метод reduce()/reduceRight() выполняет функцию обратного вызова с каждым элементом массива для вычисления единого значения (сведения к единому значению).

Метод reduce() обрабатывает элементы массива слева направо.

Метод reduceRight() обрабатывает элементы массива справа налево.

Метод reduce()/reduceRight() не затрагивает исходный массив.

В следующем примере вычисляется сумма всех чисел в массиве:

var numbers1 = [45, 4, 9, 16, 25];
var sum = numbers1.reduce(myFunction);

function myFunction(total, value, index, array) {
  return total + value;
} 

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

• Начальное/ранее возвращенное значение (total)
• Значение элемента (value)
• Индекс элемента (index)
• Сам массив (array)

В предыдущем примере в функции обратного вызова не используются параметры index и array, поэтому его код можно переписать следующим образом:

var numbers1 = [45, 4, 9, 16, 25];
var sum = numbers1.reduce(myFunction);

function myFunction(total, value) {
  return total + value;
} 

Метод reduce()/reduceRight() может принимать начальное значение:

var numbers1 = [45, 4, 9, 16, 25];
var sum = numbers1.reduce(myFunction, 100);

function myFunction(total, value) {
  return total + value;
} 

Метод Array.reduce()/Array.reduceRight() поддерживается всеми браузерами за исключением Internet Explorer 8 и более ранних версий.

Array.every()

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

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

var numbers = [45, 4, 9, 16, 25];
var allOver18 =  numbers.every(myFunction);

function myFunction(value, index, array) {
   return  value > 18;
} 

Функция обратного вызова принимает 3 параметра:

• Значение элемента (value)
• Индекс элемента (index)
• Сам массив (array)

Если функция обратного вызова использует только первый параметр (value), то другие параметры можно опустить:

var numbers = [45, 4, 9, 16, 25];
var allOver18 =  numbers.every(myFunction);

function myFunction(value) {
  return  value > 18;
} 

Метод Array.every() поддерживается всеми браузерами за исключением Internet Explorer 8 и более ранних версий.

Array.some()

Метод some() проверяет, выполняет ли заданное условие хотя бы один элемент массива.

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

var numbers = [45, 4, 9, 16, 25];
var someOver18 = numbers.some(myFunction);

function myFunction(value, index, array) {
   return  value > 18;
} 

Функция обратного вызова принимает 3 параметра:

• Значение элемента (value)
• Индекс элемента (index)
• Сам массив (array)

Метод Array.some() поддерживается всеми браузерами за исключением Internet Explorer 8 и более ранних версий.

Array.indexOf()

Метод indexOf() ищет в массиве элемент с заданным значением и возвращает его индекс.

Внимание! Первый элемент будет иметь индекс 0, второй — 1 и т. д.

В следующем примере ищем элемент со значением "Apple":

var fruits = ["Apple", "Orange", "Apple", "Mango"];
var a = fruits.indexOf("Apple"); 

Метод Array.indexOf() поддерживается всеми браузерами за исключением Internet Explorer 8 и более ранних версий.

Синтаксис:

Если элемент не найден, то метод Array.indexOf() вернет -1.

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

Array.lastIndexOf()

Метод Array.lastIndexOf() аналогичен методу Array.indexOf(), но он начинает поиск с конца массива и ведет его к началу массива.

В следующем примере ищем элемент со значением "Apple":

var fruits = ["Apple", "Orange", "Apple", "Mango"];
var a = fruits.lastIndexOf("Apple"); 

Метод Array.lastIndexOf() поддерживается всеми браузерами за исключением Internet Explorer 8 и более ранних версий.

Синтаксис:

Array.find()

Метод find() возвращает значение первого элемента массива, прошедшего заданную проверку в функции обратного вызова.

В следующем примере происходит поиск (и возврат значения) первого элемента, значение которого больше 18:

var numbers = [4, 9, 16, 25, 29];
var first =  numbers.find(myFunction);

function myFunction(value, index, array) {
  return  value > 18;
} 

Функция обратного вызова принимает 3 параметра:

• Значение элемента (value)
• Индекс элемента (index)
• Сам массив (array)

Метод Array.find() не поддерживается в старых браузерах.

Array.findIndex()

Метод findIndex() возвращает индекс первого элемента массива, прошедшего заданную проверку в функции обратного вызова.

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

var numbers = [4, 9, 16, 25, 29];
var first =  numbers.findIndex(myFunction);

function myFunction(value, index, array) {
   return  value > 18;
} 

Функция обратного вызова принимает 3 параметра:

• Значение элемента (value)
• Индекс элемента (index)
• Сам массив (array)

Метод Array.findIndex() не поддерживается в старых браузерах.