The Array Chronicles: Decoding the Machinery of Data
Array.prototype.forEach() :
forEach() is a method of the Array object, which is an iterative method that executes a provided callBackFn function once for each element in an array in ascending-index order.
forEach(callBackFn)
forEach(callBackFn, thisArg)
Parameters :
callBackFn A function to execute for each element in the array.
elementThe current element being processed in the array.indexThe index of the current element.arrayThe forEach() method of the array was called on.
thisArg (optional) A value to use as this when executing callBackFn.
Return :
None (undefined).
Does it mutate the original?
No mutation, doesn’t change the original array.
Example :
const primes = [2,3,5,7,11];
primes.forEach((element) => {
console.log(element);
});
// prints primes in console
const copyData = [];
primes.forEach((element) => {
copyData.push(element);
});
// copyData = [2,3,5,7,11]
Array.prototype.map() :
map() is a method of the Array object, which is an iterative method that executes a provided callBackFn function once for each element in an array, and constructs a new array from the results.
map(callBackFn)
map(callBackFn, thisArg)
Parameters :
callBackFn A function to execute for each element in the array. Its return value is added as a single element in the new array.
elementThe current element being processed in the array.indexThe index of the current element being processed in the array.arrayThe array map() was called on.
thisArg (optional) A value to use as this when executing callBackFn.
Return :
A new array with each element being the result of the callBackFn function.
Does it mutate the original?
No mutation, doesn’t change the original array.
Example :
const numbers = [1,2,3,4,5];
const squares = numbers.map((num) => num**2);
// squares = [1,4,9,16,25]
const prices = [10, 20, 30];
const taxRate = 0.1;
const priceTags = prices.map(price => `Price: $${price + (price * taxRate)}`);
// priceTags = [ 'Price: $11', 'Price: $22', 'Price: $33' ]
Array.prototype.filter() :
filter() is a method of the Array object, which is an iterative method that creates a shallow copy of a portion of a given array, filtered down to just the elements from the given array that pass the test implemented by the provided callBackFn.
filter(callBackFn)
filter(callBackFn, thisArg)
Parameters:
callBackFn Function to test each element. Returns true to keep the element, false otherwise.
elementThe current element being processed.indexThe index of the current element.arrayThe arrayfilter()was called on.
thisArg (optional) Value to use this when executing callBackFn.
Return:
A new array with the elements that pass the test. If no elements pass, an empty array is returned.
Does it mutate the original?
No mutation, doesn’t change the original array.
Example :
const guests = [
{ name: "Alice", age: 25 },
{ name: "Bob", age: 17 },
{ name: "Charlie", age: 30 }
];
const adults = guests.filter(guest => guest.age >= 18);
// adults = [ { name: 'Alice', age: 25 }, { name: 'Charlie', age: 30 } ]
Array.prototype.find() :
find() is a method of the Array object, which returns the first element in the provided array that satisfies the provided testing function. If no values satisfy the testing function, undefined is returned.
find(callBackFn)
find(callBackFn, thisArg)
Parameters:
callBackFn Function to execute for each element.
elementThe current element.indexThe index of the current element.arrayThe arrayfind()was called on.
thisArg (optional) Value to use as this.
Return:
The first element that passes the test; otherwise, undefined.
Does it mutate the original?
No mutation, doesn’t change the original array.
Example :
const inventory = ["Apple", "Banana", "Cherry", "Date"];
const result = inventory.find(fruit => fruit.startsWith("C"));
// result = Cherry
Arrar.prototype.reduce() :
reduce() is a method of the Array object, which executes a "reducer" callback function on each element of the array, in order, passing in the return value from the calculation on the preceding element. The final result of running the reducer across all elements of the array is a single value.
reduce(callBackFn)
reduce(callBackFn, initialValue)
Parameters :
callBackFn A function to execute for each element.
accumulatorThe value resulting from the previous call tocallBackFn.currentValueThe value of the current element.currentIndexThe index of the current element.arrayThe arrayreduce()was called on.
initialValue (optional) A value that accumulator is initialized the first time the callback is called.
Return :
The value that results from the reduction.
Does it mutate the original?
No mutation, doesn’t change the original array.
Example :
const wallet = [5, 10, 15, 20];
const totalBalance = wallet.reduce((accumulator, current) => {
return accumulator + current;
}, 0);
// totalBalance = 50
Array.prototype.every() :
every() is a method of the Array object, which tests whether all elements in the array pass the test implemented by the provided function. It returns a Boolean value.
every(callBackFn)
every(callBackFn, thisArg)
Parameters :
callBackFn Function to test for each element.
elementThe current element being processed in the array.indexThe index of the current element being processed in the array.arrayThe arrayevery()was called.
thisArg (optional)Value to use as this.
Return :
true if the callBackFn function returns a truthy value for every array element; otherwise, false.
Does it mutate the original?
No mutation, doesn’t change the original array.
Example :
const clips = [
{ name: "Scene 1", edited: true },
{ name: "Scene 2", edited: true }
];
const allDone = clips.every(clip => clip.edited === true);
// Output: true
Array.prototype.some() :
some() is a method of the Array object, which tests whether at least one element in the array passes the test implemented by the provided function.
some(callBackFn)
some(callBackFn, thisArg)
Parameters :
callBackFn Function to test for each element.
elementThe current element being processed in the array.indexThe index of the current element being processed in the array.arrayThe arraysome()was called on.
thisArg (optional) Value to use as this.
Return :
true if the callback function returns a truthy value for at least one element; otherwise, false.
Does it mutate the original?
No mutation, doesn’t change the original array.
Example :
const clips = ["Clean", "Clean", "Warning", "Clean"];
const hasError = clips.some(clip => clip === "Warning");
// Output: true
Array.prototype.splice() :
splice() is a method of the Array object, which changes the contents of an array by removing or replacing existing elements and/or adding new elements in place.
splice(start)
splice(start, deleteCount)
splice(start, deleteCount, item1, item2, /* ... */)
Parameters :
startThe index at which to start changing the array.deleteCount(optional) An integer indicating the number of elements in the array to remove.item1, item2...(optional) The elements to add to the array, beginning fromstart.
Return :
An array containing the deleted elements.
Does it mutate the original?
Yes, it changes the original array.
Example :
const team = ["Player A", "Player B", "Injured Player", "Player D"];
team.splice(2, 1, "Player E");
// team = ["Player A", "Player B", "Player E", "Player D"]
Array.prototype.shift() :
shift() is a method of the Array object, which removes the first element from an array and returns that removed element. This method changes the length of the array.
shift()
Parameters :
None.
Return :
The removed element from the array. undefined If the array is empty.
Does it mutate the original?
Yes, it changes the original array.
Example :
const queue = ["Customer 1", "Customer 2", "Customer 3"];
const served = queue.shift();
// queue = ["Customer 2", "Customer 3"]
Array.prototype.flat() :
flat() is a method of the Array object, which creates a new array with all sub-array elements concatenated into it recursively up to the specified depth.
flat()
flat(depth)
Parameters :
depth (optional) The depth level specifies how deep a nested array structure should be flattened. Defaults to 1.
Return :
A new array with the sub-array elements concatenated into it.
Does it mutate the original?
No mutation, doesn’t change the original array.
Example :
const coordinates = [1, [2, [3, [4]]]];
const flatCoordinates = coordinates.flat();
// flatCoordinates = [1, 2, [3, [4]]], by default 1
const levelOne = coordinates.flat(2);
// levelOne = [ 1, 2, 3, [ 4 ] ]
Array.prototype.reverse() :
reverse() is a method of the Array object, which reverses an array in place and returns a reference to the same array. The first array element becomes the last, and the last array element becomes the first.
reverse()
Parameters :
None.
Return :
The reference to the original array, now reversed.
Does it mutate the original?
Yes, it changes the original array.
Example :
const countdown = [1, 2, 3, 4, 5];
countdown.reverse();
// countdown = [5, 4, 3, 2, 1]
Array.prototype.includes() :
includes() is a method of the Array object, which determines whether an array includes a certain value among its entries, returning true or false as appropriate.
includes(searchElement)
includes(searchElement, fromIndex)
Parameters :
searchElementThe value to search for.fromIndex(optional) The position in this array at which to begin searching.
Return :
A Boolean which is true if the value searchElement is found; otherwise false.
Does it mutate the original?
No mutation, doesn’t change the original array.
Example :
const list = ["Bread", "Eggs", "Milk", "Cheese"];
const hasMilk = list.includes("Milk");
// hasMilk = true
Array.prototype.unshift() :
unshift() is a method of the Array object, which adds one or more elements to the beginning of an array and returns the new length of the array.
unshift(element1)
unshift(element1, element2, /* ... */)
Parameters :
elementNThe elements to add to the front of the array.
Return :
The new length property of the object upon which the method was called.
Does it mutate the original?
Yes, it changes the original array.
Example :
const tasks = ["Email boss", "Fix bug"];
tasks.unshift("Stop the fire!");
// tasks = ["Stop the fire!", "Email boss", "Fix bug"]
