JavaScript New Arrays Methods: ECMAScript 2023
Tags: javascript, programming, beginners, tutorial
Published: 2023-07-22 10:25:52

## Introduction

As the world of web development evolves, so does the JavaScript language. With each new version of ECMAScript, we are introduced to exciting features and improvements that enhance the way we write code. In ECMAScript 2023, JavaScript has introduced several new array methods that make working with arrays even more powerful and efficient. 
In this blog post, we will explore five new array methods introduced in ECMAScript 2023, namely `toSorted()`, `toSpliced()`, `toReversed()`, `findLast()`, and `findLastIndex()`. We will also discuss how they differ from their existing counterparts.

### 1. `findLastIndex()`

The `findLastIndex()` method returns the index of the last element in the array that satisfies the provided testing function. If no element matches the condition, it returns `-1`.

#### Example:
```javascript
const scores = [90, 85, 95, 70, 80];
const lastIndexAbove80 = scores.findLastIndex((score) => score > 80);

console.log(lastIndexAbove80); // Output: 2 (index of element 95)
```

### 2. `toReversed()`

The `toReversed()` method returns a new array with the elements in reverse order compared to the original array. Like the previous methods, this one also leaves the original array unchanged.

#### Example:
```javascript
const letters = ["a", "b", "c", "d"];
const reversedLetters = letters.toReversed();

console.log(reversedLetters); // Output: ["d", "c", "b", "a"]
```

### 3. `toSpliced()`

The `toSpliced()` method returns a new array with a specified number of elements removed from the original array, starting at the specified index. Like `toSorted()`, this method does not modify the original array and returns a new one.

#### Example:
```javascript
const numbers = [1, 2, 3, 4, 5];
const splicedNumbers = numbers.toSpliced(1, 2, 8, 9);

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

### 4. `toSorted()`

The `toSorted()` method is used to return a new sorted array based on the elements of the original array. This method does not modify the original array; instead, it creates a new one with the sorted elements.

#### Example:
```javascript
const fruits = ["banana", "apple", "orange", "grapes"];
const sortedFruits = fruits.toSorted();

console.log(sortedFruits); // Output: ["apple", "banana", "grapes", "orange"]
```

### 5 `findLast()`

The `findLast()` method returns the last element in the array that satisfies the provided testing function. If no element matches the condition, it returns `undefined`.

#### Example:
```javascript
const numbers = [10, 20, 30, 40, 50];
const lastEvenNumber = numbers.findLast((num) => num % 2 === 0);

console.log(lastEvenNumber); // Output: 40
```

### Differences from Existing Methods

It's important to note that the new array methods introduced in ECMAScript 2023 have similarities with some existing methods but have subtle differences that can be advantageous in certain scenarios.

#### `toSorted()` vs. `sort()`

Both `toSorted()` and `sort()` are used for sorting arrays. However, `sort()` modifies the original array in place, while `toSorted()` returns a new sorted array, leaving the original array unchanged.

#### `toSpliced()` vs. `splice()`

Similar to the sorting methods, `splice()` alters the original array, while `toSpliced()` returns a new array with elements removed, without modifying the original array.

#### `toReversed()` vs. `reverse()`

Just like `sort()` and `splice()`, `reverse()` modifies the original array in place, reversing the order of elements. On the other hand, `toReversed()` returns a new array with elements in reverse order without altering the original array.

#### `findLast()` and `findLastIndex()` vs. `lastIndexOf()` and `findIndex()`

While `lastIndexOf()` and `findIndex()` return the first occurrence index of an element matching the condition, `findLast()` and `findLastIndex()` return the last occurrence index or element that satisfies the condition, respectively.

## Conclusion:
In conclusion, ECMAScript 2023 brings these new array methods to make array manipulation more convenient and efficient. By leveraging these methods, developers can create cleaner and more concise code without directly modifying the original arrays. As with any new feature, it's essential to understand how they work to make the most of their capabilities and use them effectively in your JavaScript projects.

Happy coding💻!

Feel Free to comment your thoughts regarding the topic

![Feel Free to comment](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/xmc48xleneipzms0991l.gif)

Connect with me on <a href="https://twitter.com/abidullah_786">Twitter</a>, <a href="https://www.linkedin.com/in/abidullah786/">Linkedin</a>and <a href="https://github.com/abidullah786">GitHub</a> to stay updated and join the discussion!