5 less common array methods in JavaScript

The title "Less common" holds since I haven't seen them getting used very frequently. Because there are popular data structure libraries (lodash, underscore, etc) present out there to do the heavy lifting. I won't be talking about those methods. Let's cover what vanilla JavaScript has to offer -

copyWithin(target[, start[, end]])

As the name suggests it copies part of an array to other locations in the same array. Here copying process is shallow, which mutates the original array. It takes three parameters.

• target - Index at which copy the sequence to. The negative index will be counted from the end. If the target is equal or greater than arr.length then nothing will be copied
• start - Index at which to start copying elements from. The same negative indexing concept applies here as well. If omitted then copying will start from index 0.
• end - Same usage as start. The only difference is copyWithin() does not include this index. Lets take an example to understand them -

const arr = ['john', 'doe', 'foo', 'bar', 'egg'];
console.log(arr.copyWithin(0,1,3)); //Answer - ["doe", "foo", "foo", "bar", "egg"]

flatMap(function callback(currentValue[, index[, array]])

It maps every element of an array using the callback function and returns a new flatten array. So basically its a fusion between flat and map methods (like Goku + Vegita = Gogita 😁 - DBZ fans). Lets observe its super powers -

const arr = ["Hi I am", "", "Sunny Prakash"];
console.log(arr.flatMap(x => x.split(" ")));
//[ 'Hi', 'I', 'am', '', 'Sunny', 'Prakash' ]

Tokenization achieved!! Pretty cool right.

every(callback(element[, index[, array]])[, thisArg])

Let say you have an array of objects. And you want to return true/false based on some condition that has been satisfied by every object present in the array. Huh!! what's the big deal you can achieve it with find. In a way yes, you can. But I mentioned you should specifically return booleans. every should be your first weapon in your arsenal to tackle this situation. every takes two parameters. First is the callback and the second can be used as 'this' for the callback. The callback itself takes three parameters namely array element, index of the element, and the array itself. For example -

function isBelowTotal(current, i, originalArray){
return current < this.total * this.tax
}
const arr = [1, 30, 39, 29, 10, 130];
console.log(arr.every(isBelowTotal, {tax: 0.4, total: 100}));
// false

some(callback(element[, index[, array]])[, thisArg])

some is same as every method. Except one condition but most important one. It tests whether at least one element in the array passes the condition implemented in the callback. So if every works like an && operator then some works like || operator.

const employee = [
{name: 'sunny', gender: 'male'},
{name: 'Rakesh', gender: 'male'},
{name: 'Indrani', gender: 'female'}
]
cons hasFemaleEmployee = employee(emp => emp.gender === 'female');
//hasFemaleEmployee = true

slice([begin[, end]])

I won't say it is used rarely, but people often get confused between slice and splice. So I have included in my list. slice takes two indices of which the second one is excluded and it will return a new array containing a sliced portion of the original array. Note here that the original array will not be mutated.

const alpha = ['A', 'B', 'C', 'D', 'E'];
const sliced = alpha.slice(2);
console.log(sliced); // ['C', 'D', 'E']
console.log(alpha); // ['A', 'B', 'C', 'D', 'E']

splice, on the other hand, changes the content of the original array by replacing or removing elements. Its first parameter is the start index and the second is deleteCount. However, there is a third parameter that exists as well which distinguishes whether splice will remove or replace elements. splice also returns the removed element, but it will modify the original array as well.

const alpha = ['A', 'B', 'C', 'D', 'E'];
const spliced = alpha.splice(0,1);
console.log(spliced); // ['A']
console.log(alpha); // ['B', 'C', 'D', 'E']

For further reading, you can refer to MDN Docs. You can find the original post here.

Let me know your feedbacks in the comment.