When working with arrays, repeatedly creating functions to access and modify them can become tedious. The following array methods streamline your workflow and make your code cleaner.
Array.findIndex(function) -
The .findIndex() method iterates through an array, calling the given function for each element. If the function returns true for any element, it returns that element’s index; otherwise, it returns -1. Here’s an example.
var arr = ["Here's", "an", "example!"];
var output = arr.findIndex((element, index, array) => element === "example!"); // Returns 2
Technicalities -
- The callback function uses the current element, its index, and the array as arguments.
- A downside to this method is that it will only return the first value that returns true.
Uses -
- Verifying that certain values exist in an array.
- Finding and altering certain values in an array Searching arrays for values that meet different criteria.
Array.splice(start, deleteCount, item1) -
The .splice() method extends the functionality of .push() and .pop(). This method inserts items into an array after the start argument and deletes a specified number of elements, starting with the start index. Here’s an example.
var arr = ["Here's", "an", "example!"];
arr.splice(1, 1, "my", "grand"); // Returns ["Here's", "my", "grand", "example!"]
Technicalities -
- The method can take an infinite number of items.
- deleteCount can be 0.
- Items aren't required.
- The method alters the original array.
- It returns an array containing the deleted values.
Uses -
- Replacing array elements.
- It can be used as a precise .push().
- It can be used as a precise .pop().
Array.reduce(function, initialValue) -
The .reduce() method calls a given function for every element in an array, using four parameters: accumulator, the value returned by the previous function call; initialValue, used for the first function call; currentValue, the current element in the array; currentIndex, the current index; and the array itself. The method returns one value, being the final result of the given function. Here’s an example.
var arr = ["Here's", "an", "example!"];
arr.reduce((accumulator, currentValue) => accumulator + "-" + currentValue); // Returns "Here's-an-example!"
arr = [1, 2, 3, 4];
arr.reduce((accumulator, currentValue) => accumulator * currentValue, -1); // Returns -24
Technicalities -
- If no initialValue is given, the first value of the array will be used, and the second value will become the currentValue.
- The original array won’t be affected.
Uses -
- Calculating numbers in an array.
- Comparing values in an array.
With these methods, you can efficiently manage your arrays without having to jump through hoops of code.
Resources: developer.mozilla.org
Top comments (0)