## DEV Community

Anthony DiPietrantonio

Posted on

# 10 Javascript Array Methods You Should Know

If you're a Javascript developer, you're probably very familiar with the array method trinity of map, filter, and reduce, as well as the push, pop, shift, and unshift methods β but there are a handful of other methods that you may not know about (yet). This article will cover some of the other array methods that I think are most useful.

CONCAT β used to merge two or more arrays (returns a new array)

``````let firstArray = [1,2,3]
let secondArray = ["a","b","c"]
let mergedArray = firstArray.concat(secondArray)

console.log(mergedArray) // [1,2,3,"a","b","c"]

let thirdArray = ["π","π","π"]
let anotherMergedArray = firstArray.concat(secondArray, thirdArray)

console.log(anotherMergedArray) // [1, 2, 3, "a", "b", "c", "π", "π", "π"]
``````

Note: This can also be done with the spread operator like so:

``````let firstArray = [1,2,3]
let secondArray = ["a","b","c"]
let mergedArray = [...firstArray, ...secondArray]

console.log(mergedArray) // [1,2,3,"a","b","c"]
``````

EVERY β returns true or false depending on if ... every ... element in the array "passes" a test (returns true / truthy)

``````let numbers = [1,2,3,4,5]
console.log(numbers.every(number => number < 6)) // true

let numbers = [1,2,3,4,10]
console.log(numbers.every(number => number < 6)) // false
``````

FIND β returns the first value that passes a test (returns true / truthy)

``````let numbers = [1,10,6,22,43,31,55]
console.log(numbers.find(number => number > 30)) // 43
``````

FINDINDEX β returns the index of the first value that passes a test (returns true / truthy), otherwise returns -1

``````let numbers = [1,10,6,22,43,31,55]
console.log(numbers.findIndex(number => number > 30)) // 4
``````

FLAT β concats arrays that live inside another array and returns a new array. You can specify how deep you want to flatten the arrays

``````// without passing a depth to flat, it will flatten sub arrays one level deep
let array1 = ["a","b","c",["d","e"]]
console.log(array1.flat()) // ["a", "b", "c", "d", "e"]

// notice we have an array two levels deep here
let array2 = ["a","b","c",[["d","e"]]]
console.log(array2.flat()) // ["a", "b", "c", ["d", "e"]]
console.log(array2.flat(2)) // ["a", "b", "c", "d", "e"]

// we can remove empty array elements with flat() as well
let array3 = [1,2,3,,4,,6]
console.log(array3.flat()) // [1, 2, 3, 4, 6]
``````

FROM β creates a new array from an array -like or iterable object (strings, DOM elements, etc)

``````// quickly split a string
let string = "letters"
console.log(Array.from(string)) // ["l", "e", "t", "t", "e", "r", "s"]

// take DOM elements, convert to an array
let paragraphs = Array.from(document.getElementsByTagName("p"))
console.log(paragraphs) // will be an array of all the paragraph tags
``````

This method allows you to pass in a second parameter, a map function, that will allow you to do something to every element of the array

``````// we have an array of objects,
let people = [{name: "Bill", age: 5},{name: "Jill", age: 5},{name: "Phil", age: 5}]
let names = Array.from(people, (person => person.name))
console.log(names) // ["Bill", "Jill", "Phil"]
``````

INCLUDES β returns true/false if an array includes a certain value

``````let numbers = [1,2,3]
console.log(numbers.includes(3) // true
console.log(numbers.includes(5) // false
``````

This method can take in a second parameter, which is the index you want to start your search from

``````let numbers = [4,5,6]

// does numbers include 5 starting from index 1 (second element)?
console.log(numbers.includes(5, 1))  // true

// does numbers include 5 starting from index 2 (third element)?
console.log(numbers.includes(5, 2)) // false
``````

INDEXOF β returns the first index of the value that you are looking for, otherwise returns -1

``````let numbers = [1,10,6,22,43,6,55]
console.log(numbers.indexOf(6)) // 2
console.log(numbers.indexOf(1000)) // -1
``````

LASTINDEXOF β returns the last index of the value that you are looking for, otherwise returns -1

``````let numbers = [1,10,6,22,43,6,55]
console.log(numbers.lastIndexOf(6)) // 5
console.log(numbers.lastIndexOf(1000)) // -1
``````

SOME β returns true or false depending on if any element in the array "passes" a test (returns true / truthy)

``````let numbers = [1,2,3,4,5]
console.log(numbers.some(number => number > 4)) // true
console.log(numbers.some(number => number > 6)) // false
``````

All done β if you've enjoyed this article, feel free to check out my other Javascript articles:

JS Array Methods You Should Know: .map, .reduce, and .filter (ft. Chaining)

Javascript Basics: Use .push, .pop, .shift, and .unshift to Manipulate Arrays

Javascript: The Difference Between .slice and .splice

Javascript: Destructure Objects and Arrays for Cleaner Code

Javascript: Console.log & Beyond

As always, refer to MDN for more info:

Arrays

Feel free to reach out on any of my socials for questions, feedback, or just to connect / say hello π.