10 List of most used JavaScript Array Methods
Published: 2023-09-03 15:18:43

Arrays are one of the fundamental data structures in JavaScript, and they come with a plethora of built-in methods that make manipulating and working with arrays more efficient and convenient. In this article, we'll explore some of the most commonly used JavaScript array methods, along with examples to demonstrate their usage.

## 1. `push()`

The `push()` method adds one or more elements to the end of an array and returns the new length of the array.

```javascript
const fruits = ['apple', 'banana', 'cherry'];
fruits.push('date');

console.log(fruits); // Output: ['apple', 'banana', 'cherry', 'date']
```

## 2. `pop()`

The `pop()` method removes the last element from an array and returns that element.

```javascript
const fruits = ['apple', 'banana', 'cherry'];
const removedFruit = fruits.pop();

console.log(removedFruit); // Output: 'cherry'
console.log(fruits); // Output: ['apple', 'banana']
```

## 3. `shift()`

The `shift()` method removes the first element from an array and returns that element.

```javascript
const fruits = ['apple', 'banana', 'cherry'];
const removedFruit = fruits.shift();

console.log(removedFruit); // Output: 'apple'
console.log(fruits); // Output: ['banana', 'cherry']
```

## 4. `unshift()`

The `unshift()` method adds one or more elements to the beginning of an array and returns the new length of the array.

```javascript
const fruits = ['banana', 'cherry'];
fruits.unshift('apple');

console.log(fruits); // Output: ['apple', 'banana', 'cherry']
```

## 5. `concat()`

The `concat()` method merges two or more arrays, creating a new array without modifying the existing arrays.

```javascript
const fruits = ['apple', 'banana'];
const vegetables = ['carrot', 'tomato'];
const combined = fruits.concat(vegetables);

console.log(combined); // Output: ['apple', 'banana', 'carrot', 'tomato']
```

## 6. `slice()`

The `slice()` method extracts a portion of an array into a new array, without modifying the original array.

```javascript
const numbers = [1, 2, 3, 4, 5];
const sliced = numbers.slice(1, 4);

console.log(sliced); // Output: [2, 3, 4]
```

## 7. `splice()`

The `splice()` method changes the contents of an array by removing or replacing elements at a specified index.

```javascript
const fruits = ['apple', 'banana', 'cherry'];
fruits.splice(1, 1, 'orange');

console.log(fruits); // Output: ['apple', 'orange', 'cherry']
```

## 8. `forEach()`

The `forEach()` method executes a provided function once for each array element.

```javascript
const numbers = [1, 2, 3];
numbers.forEach((num) => console.log(num));

// Output:
// 1
// 2
// 3
```

## 9. `map()`

The `map()` method creates a new array with the results of calling a provided function on every element in the array.

```javascript
const numbers = [1, 2, 3];
const squaredNumbers = numbers.map((num) => num * num);

console.log(squaredNumbers); // Output: [1, 4, 9]
```

## 10. `filter()`

The `filter()` method creates a new array with all elements that pass the test implemented by the provided function.

```javascript
const numbers = [1, 2, 3, 4, 5];
const evenNumbers = numbers.filter((num) => num % 2 === 0);

console.log(evenNumbers); // Output: [2, 4]
```

## Conclusion

JavaScript array methods are powerful tools for working with arrays efficiently. This list provides an overview of some of the most commonly used array methods, but there are many more to explore. Understanding these methods is essential for effective array manipulation in JavaScript.

Feel free to explore the official JavaScript documentation for more array methods and their detailed descriptions.

Happy coding!