Вот список наиболее распространенных методов массива в JavaScript.
// Mutating push() // Insert an element at the end pop() // Remove an element from the end unshift() // Inserts an element in the beginning shift() // Remove first element // Iterating forEach() // Iterates an array filter() // Iterates an array and result is filtered array map() // Iterates an array and result is new array reduce() // "Reduces" the array into single value (accumulator) // Others slice() // Returns desired elements in a new array concat() // Append one or more arrays with given array
Методы мутации
Существует множество методов массива, которые изменяют массив. Мутация массива означает, что результирующий массив примет форму, отличную от предыдущей, аналогичную английскому определению мутации. Итак, давайте взглянем на некоторые из наиболее распространенных:
push ()
const array = [1, 2, 3, 4] array.push(10) // 5 (push returns the length of the new array) // array = [1, 2, 3, 4, 10]
push вставит переданный элемент в конец массива и вернет длину нового массива.
поп ()
const array = [1, 2, 3 , 4] array.pop() // 4 (pop returns the element removed) // array = [1, 2, 3]
pop удалит последний элемент в массиве и вернет этот элемент.
unshift ()
const array = [1, 2, 3, 4] array.unshift(9, 10) // 6 (unshift returns the length of new array) // array = [9, 10, 1, 2, 3, 4]
Метод unshift добавит элементы, переданные в начало массива, сохраняя порядок, и вернет длину нового массива.
Note: Вы можете передать в функцию столько элементов, сколько захотите.
сдвиг()
const array = [1, 2, 3, 4] array.shift() // 1(shift returns the removed element) // array = [2, 3, 4]
Метод shift удалит первый элемент массива и вернет удаленный элемент.
Итерационные методы
Методы итерации очень эффективны, потому что итерация по массиву - одна из наиболее распространенных инструкций, которые мы хотим выполнить. Итак, давайте посмотрим на некоторые из них:
для каждого()
const array = [1, 2, 3, 4]
array.forEach((elemnt, index) => {
console.log(`Element ${element} at index ${index}`)
}
Метод forEach вызовет функцию, предоставленную один раз для каждого элемента в массиве, сохраняя порядок. Эта функция может принимать 3 разных аргумента: element, index, array. Убедитесь, что порядок, в котором вы передаете эти параметры, соответствует порядку.
фильтр()
const array = [1, 2, 3, 4] const filteredArray = array.filter(element => element%2) // array = [1, 2, 3, 4] // filteredArray = [1, 3]
Метод filter вернет новый массив с элементами, которые вернули true из предоставленной функции. Обратите внимание, что в приведенном выше примере функция, переданная в метод фильтра, возвращает true, если элемент нечетный, поэтому вы видите, что filteredArray равно [1, 3].
Note: метод filter не изменяет исходный массив. Это создаст новый массив.
карта()
const array = [1, 2, 3, 4] const mapArray = array.map(element => element * 2) // array = [1, 2, 3, 4] // mapArray = [2, 4, 6, 8]
map создаст новый массив элементов, где каждый элемент является значением, возвращаемым предоставленной функцией. В приведенном выше примере показана функция удвоения каждого элемента. Следовательно, mapArray равно [2, 4, 6, 8].
Note: так же, как и метод filter, map не изменяет исходный массив, потому что он создаст новый массив.
уменьшать()
const array = [1, 2, 3, 4] const result = array.reduce((accumulator, current) => ( accumulator + current ), 10) // array = [1, 2, 3, 4] // result = 20
reduce метод принимает reducer функцию и начальное значение в качестве аргументов. Функция reducer может принимать до 4 аргументов: accumulator, element, index и array. Функция редуктора будет выполняться для каждой итерации, а возвращаемое значение каждой итерации будет использоваться для следующей итерации.
Note: метод reduce возвращает одно значение, а не массив.
Другие
Наконец, есть еще пара методов, которые очень важно знать и которые очень распространены в кодовой базе JavaScript.
кусочек()
const array = [1, 2, 3, 4] const slicedArray = array.slice(0, 2) // array = [1, 2, 3, 4] // slicedArray = [1, 2]
Метод slice создаст новый массив с элементами из переданного диапазона индексов. В приведенном выше примере мы указываем начальный индекс (0) и конечный индекс (2), что дает нам новый массив [1, 2] . Также обратите внимание, что исходный массив не изменился.
Note: Конечный индекс - exclusive, что означает, что элемент с этим конечным индексом не включен в новый массив.
concat ()
const array = [1, 2, 3, 4] const concatArray = array.concat([5, 6, 7, 8]) // array = [1, 2, 3, 4] // concatArray = [1, 2, 3, 4, 5, 6, 7, 8]
concat создаст новый массив, содержащий все элементы исходного массива, за которым следует каждый из переданных массивов. Этот метод не изменяет исходный массив.
Note: в качестве аргументов можно передать более одного массива.
Мы рассмотрели некоторые из наиболее распространенных методов массива JavaScript в этой небольшой памятке, и, надеюсь, это будет полезно для многих из вас. В JavaScript доступно гораздо больше методов массивов, кроме тех, которые мы рассмотрели, которые столь же полезны, если не больше, что вы проверяете в документации, такой как MDN.
