JavaScript Array methods explained
Tags: javascript, webdev, programming, tutorial
Published: 2022-05-25 06:29:58

## Let's start!  


## 1. concat()
Returns a new array that is this array joined with other array(s) and/or value(s).

```javascript
const fruits = ['🍉', '🍎', '🍒', '🍌'];
const vegetables = ['🧅', '🌽', '🥕', '🥑'];

// 1. concat()
const food = fruits.concat(vegetables); // ["🍉", "🍎", "🍒", "🍌", "🧅", "🌽", "🥕", "🥑"]
```

## 2. copyWithin()
Copies a sequence of array elements within the array.

```javascript
// 2. copyWithin()
const fruits = ['🍉', '🍎', '🍒', '🍌'];

const fruitsCopy = fruits.copyWithin(0, 2); // ["🍒", "🍌", "🍒", "🍌"]
```

## 3. every()
Returns `true` if every element in this array satisfies the testing function.

```javascript
// 3. every()
const fruits = ['🍉', '🍎', '🍒', '🍌'];

const allBananas = fruits.every(fruit => fruit === '🍌'); // false
```

## 4. fill()
Fills all the elements of an array from a start index to an end index with a static value.

```javascript
// 4. fill()
const fruits = ['🍉', '🍎', '🍒', '🍌'];

const lemons =  fruits.fill('🍋'); // ["🍋", "🍋", "🍋", "🍋"]
```

## 5. filter()
Returns a new array containing all elements of the calling array for which the provided filtering function returns `true`.

```javascript
// 5. filter()
const fruits = ['🍉', '🍎', '🍒', '🍌'];

const onlyBananas = ['🍉', '🍎', '🍌', '🍌'].filter(fruit => fruit === '🍌'); // ["🍌", "🍌"]
```

## 6. find()
Returns the found `element` in the array, if some element in the array satisfies the testing function, or `undefined` if not found.

```javascript
// 6. find()
const fruits = ['🍉', '🍎', '🍒', '🍌'];

const cherry = fruits.find(fruit => fruit === '🍒'); // "🍒"
```

## 7. findIndex()
Returns the found index in the array, if an element in the array satisfies the testing function, or `-1` if not found.

```javascript
// 7. findIndex()
const fruits = ['🍉', '🍎', '🍒', '🍌'];

const cherryIndex = fruits.findIndex(fruit => fruit === '🍒'); // 2
```

## 8. forEach()
Calls a function for each element in the array.

```javascript
// 8. forEach()
const vegetables = ['🧅', '🌽', '🥕', '🥑'];

vegetables.forEach(vegetable => console.log(vegetable));
// "🥦"
// "🌽"
//  "🥕"
//  "🥑"
```

## 9. includes()
Determines whether the array contains a value, returning `true` or `false` as appropriate.

```javascript
// 9. includes()
const vegetables = ['🧅', '🌽', '🥕', '🥑'];

const includesCorn = vegetables.includes('🌽'); // true
const includesTomato = vegetables.includes('🍅'); // false
```

## 10. join()
Joins all elements of an array into a string.

```javascript
// 10. join()
const vegetables = ['🧅', '🌽', '🥕', '🥑'];

const vegetablesGroup = vegetables.join(''); // "🥦🌽🥕🥑"
```

## 11. map()
Returns a new array containing the results of calling a function on every element in this array.

```javascript
// 11. map()
const vegetables = ['🧅', '🌽', '🥕', '🥑'];

const doubledVegetables = vegetables.map(vegetable => vegetable + vegetable); 
// ["🥦🥦", "🌽🌽", "🥕🥕", "🥑🥑"]
```

## 12. push()
Adds one or more elements to the end of an array, and returns the new length of the array.

```javascript
// 12. push()
const fruits = ['🍉', '🍎', '🍒', '🍌'];

fruits.push('🥝'); // ["🍉", "🍎", "🍒", "🍌", "🥝"]
```

## 13. reverse()
Reverses the order of the elements of an array in place. 

```javascript
// 13. reverse()
const fruits = ['🍉', '🍎', '🍒', '🍌'];

const fruits = ['🍉', '🍎', '🍒', '🍌'];

const reversedFruits = fruits.reverse(); // ["🍌", "🍒", "🍎", "🍉"]
```

## 14. slice()
Extracts a section of the calling array and returns a new array.

```javascript
// 14. slice()
const fruits = ['🍉', '🍎', '🍒', '🍌'];

fruits.slice(2); // ["🍒", "🍌"]
```

## 15. some()
Returns `true` if at least one element in this array satisfies the provided testing function.

```javascript
// 15. some()
const fruits = ['🍉', '🍎', '🍒', '🍌'];

const bananaExists = fruits.some(fruit => fruit === '🍌')); // true
```

## 16. sort()
Sorts the elements of an array in place and returns the array.

```javascript
// 16. sort()
const fruits = ['🍉', '🍎', '🍒', '🍌', '🍉', '🍉', '🍒', '🍎', '🍌'];
fruits.sort(); // ["🍉", "🍉", "🍉", "🍌", "🍌", "🍎", "🍎", "🍒", "🍒"]
```

## 17. splice()
Adds and/or removes elements from an array.

```javascript
// 17. splice()
const fruits = ['🍉', '🍎', '🍒', '🍌'];

fruits.splice(2, 1, '🥝'); // ["🍉", "🍎", "🥝", "🍌"]
```

If you liked this article, be sure to ❤️ it.

### Happy coding! ❤️

If you have any questions, you can contact me on [Twitter](https://twitter.com/denicmarko).

You can find a ton of real-life tips and resources on my [blog](https://markodenic.com/blog/).