JavaScript Array Functions

Question 1

Array.map()

Answer 1

The map() method is one of the most commonly used functions in JavaScript, particularly when working with arrays. It allows you to create a new array by applying a function to each element in an existing array. In this way, you can easily transform an array’s values in a concise and readable way.

The basic syntax for using the map() method is as follows:
~~~
array.map(function(currentValue, index, array) {
// Function body
}, thisArg);
~~~

The first argument is a callback function that will be called for each element in the array. The callback function can take up to three arguments:

currentValue: The value of the current element being processed in the array.
index: The index of the current element being processed in the array.
array: The array that map() was called upon.
The **second argument **(thisArg) is optional and sets the value of this inside the callback function.
~~~
// Code
const list = [1, 2, 3, 4];
list.map((el) => el * 2); // [2, 4, 6, 8]
~~~

Question 2

Array.filter()

Answer 2

The array.filter() method allows you to create a new array by filtering out elements that don’t meet a specific condition. The filter() method does not modify the original array and returns a new array with the filtered elements.

The syntax for using the filter() method is as follows:
~~~
array.filter(callback(element[, index[, array]])[, thisArg])
~~~

Let’s break down the different parts of this syntax:

array: The array that you want to filter
callback: A function that is called for each element in the array, taking in three arguments:
1. element: The current element being processed in the array
2. index (optional): The index of the current element being processed
3. array (optional): The array that filter() was called upon
thisArg (optional): An object that specifies the value of this within the callback function

The callback() function should return a Boolean value. If it returns true, the element will be included in the new filtered array. If it returns false, the element will be excluded.
~~~
// Code
const list = [1, 2, 3, 4];
list.filter((el) => el % 2 === 0); // [2, 4]
~~~

Question 3

Array.reduce()

Answer 3

Reduce the array to a single value. The value returned by the function is stored in an *accumulator *(result/total).
~~~
const list = [1, 2, 3, 4, 5];
list.reduce((total, item) => total + item, 0); // 15
~~~

Question 4

Array.reduceRight()

Answer 4

Array.reduceRight() is a built-in function in JavaScript that is used to apply a function to each element of an array from right to left, and reduce the array to a single value. It is similar to Array.reduce(), but it processes the elements of the array from right to left instead of from left to right.

The syntax for using Array.reduceRight() is:
~~~
array.reduceRight(callback[, initialValue])
~~~

The callback function takes four arguments:

1. accumulator - the accumulated value, which is either the initial value passed to Array.reduceRight() or the previous value returned by the callback function.
2. currentValue - the value of the current element being processed.
3. currentIndex - the index of the current element being processed.
   array - the original array that reduceRight() was called on.
4. The initialValue argument is optional, and if it is provided, it is used as the initial value for the accumulator. If it is not provided, the last element of the array is used as the initial value for the accumulator, *and *the reduction starts from the second-to-last element.

// Code
const list = [1, 2, 3, 4, 5];
list.reduceRight((total, item) => total + item, 0); // 15

Question 5

Array.fill()

Answer 5

Array.fill() is a method in JavaScript that allows you to** fill all the elements of an array with a static value**. This method is particularly useful when you need to create an array with a specific size and initialize all its elements with the same value.
~~~
// Code
const list = [1, 2, 3, 4, 5];
list.fill(0); // [0, 0, 0, 0, 0]

const arr = new Array(5); // Creates an empty array of length 5
arr.fill(0); // Fills the array with zeros

console.log(arr); // Output: [0, 0, 0, 0, 0]

const arr2 = [1, 2, 3, 4]
arr2.fill(‘x’, 1, 3)

console.log(arr2) // Output : [ 1, “x”, “x”, 4 ]
~~~

Question 6

Array.find()

Answer 6

The arr.find() method in JavaScript returns the value of the first element in an array that satisfies a provided testing function. It is similar to the arr.filter() method, but instead of returning an array of all elements that satisfy the condition,** it returns only the first element that satisfies the condition**. If no element satisfies the condition, undefined is returned.

The syntax for find() is as follows:
~~~
find(function (element, index, array) { /* … */ }, thisArg)
~~~

The callback function takes up to three arguments:
1. element: The current element being processed in the array.
2. index: The index of the current element being processed in the array.
3. array: The array that the find() method was called upon. The callback function should return a truthy value if the current element satisfies the condition.

thisArg (optional): An object to which this keyword can refer in the callback function. If it is not provided, this keyword refers to the global object.

// Code
const list = [1, 2, 3, 4, 5];
list.find((el) => el === 3); // 3
list.find((el) => el === 6); // undefined

Question 7

Array.indexOf()

Answer 7

Array.indexOf is a built-in JavaScript method that allows you to find the index of a specified element in an array. The method returns the index of the first occurrence of the specified element in the array,or -1 if the element is not found.

The syntax for using Array.indexOf is as follows:
~~~
array.indexOf(searchElement)
array.indexOf(searchElement, fromIndex)
~~~

The first syntax searches the entire array for the specified element and returns the **index of the first occurrence. **

The second syntax allows you to start the search from a specific index, specified by the fromIndex parameter.

// Code
const list = [1, 2, 3, 4, 5];
list.indexOf(3); // 2
list.indexOf(6); // -1

Question 8

Array.lastIndexOf()

Answer 8

Returns the last index at which a given element can be found in the array, or -1 if it is not present. The array is searched backwards, starting at fromIndex.

// Code
const list = [1, 2, 3, 4, 5];
list.lastIndexOf(3); // 2
list.lastIndexOf(3, 1); // -1

Question 9

Array.findIndex()

Answer 9

The Array.findIndex Instead of returning a new array with all elements that pass a test, Array.findIndex returns the index of the first element in the array that passes the test. If no elements pass the test, Array.findIndex returns -1.

The syntax for find() is as follows:
~~~
find(function (element, index, array) { /* … */ }, thisArg)
~~~

The callback function takes up to three arguments:
1. element: The current element being processed in the array.
2. index (optional): The index of the current element being processed in the array.
3. array (optional): The array findIndex was called upon.
The callback function should return true if the current element satisfies the test, and false otherwise.

Optionally, you can provide a thisArg parameter, which will be used as the this value inside the callback function.

const numbers = [2, 4, 6, 8, 10];
const firstEvenIndex = numbers.findIndex(num => num % 2 === 0);
console.log(firstEvenIndex); // Output: 0

// Code
const array = [5, 12, 8, 130, 44];
array.findIndex((element) => element > 13);

Question 10

Array.includes()

Answer 10

Array.includes() is a built-in JavaScript method that returns a **boolean **value indicating whether an array includes a certain element.

// Code
const list = [1, 2, 3, 4, 5];
list.includes(3); // true
list.includes(6); // false

const arr = ["apple", "banana", "orange"];

console.log(arr.includes("banana")); // Output: true
console.log(arr.includes("BANANA")); // Output: false
console.log(arr.includes("grape")); // Output: false

Question 11

Array.pop()

Answer 11

Removes the last element from an array and returns that element.

// Code
const list = [1, 2, 3, 4, 5];
list.pop(); // 5
list; // [1, 2, 3, 4]

Question 12

Array.push()

Answer 12

Appends new elements to the** end** of an array, and returns the new length.
~~~
// Code
const list = [1, 2, 3, 4, 5];
list.push(6); // 6
list; // [1, 2, 3, 4, 5, 6]
~~~

Question 13

Array.shift()

Answer 13

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

This method modifies the original array.

// Code
const list = [1, 2, 3, 4, 5];
list.shift(); // 1
list; // [2, 3, 4, 5]

const myArray = [1, 2, 3, 4];
const firstElement = myArray.shift();
console.log(myArray); // prints [2, 3, 4]
console.log(firstElement); // prints 1

Question 14

Array.unshift()

Answer 14

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

This method modifies the original array.

// Code
const list = [1, 2, 3, 4, 5];
list.unshift(0); // 6
list; // [0, 1, 2, 3, 4, 5]

const myArray = [1, 2, 3, 4];
myArray.unshift(0);
console.log(myArray); // prints [0, 1, 2, 3, 4]

Question 15

Array.splice()

Answer 15

The splice() method changes the contents of an array by removing or replacing existing elements and/or adding new elements in place.

This method modifies the original array
~~~
// Code
const list = [1, 2, 3, 4, 5];
list.splice(1, 2); // [2, 3]
list; // [1, 4, 5]

const myArray = [1, 2, 3, 4];
myArray.splice(2, 1, “a”, “b”);
console.log(myArray); // prints [1, 2, “a”, “b”, 4]
~~~

Question 16

Array.slice()

Answer 16

Returns a shallow copy of a portion of an array into a new array object selected from begin to end (end not included).

The original array will not be modified.

// Code
const list = [1, 2, 3, 4, 5];
list.slice(1, 3); // [2, 3]
list; // [1, 2, 3, 4, 5]

const myArray = [1, 2, 3, 4];
const newArray = myArray.slice(1, 3);
console.log(newArray); // prints [2, 3]
console.log(myArray); // prints [1, 2, 3, 4]

Question 17

Array.join()

Answer 17

Array.join() is a method that can be used to concatenate all elements of an array into a single string, separated by a specified separator.

This method does not change the original array, but rather returns a new string that is the result of joining the elements of the array.

The basic syntax of Array.join() is as follows:
~~~
array.join(separator)
~~~

Here, separator is the character that will be used to separate the elements of the array. If no separator is specified, the default separator is a comma (,).

// Code
const list = [1, 2, 3, 4, 5];
list.join(', '); // "1, 2, 3, 4, 5"

Question 18

Array.reverse()

Answer 18

Reverses the order of the elements in an array.
~~~
// Code
const list = [1, 2, 3, 4, 5];
list.reverse(); // [5, 4, 3, 2, 1]
list; // [5, 4, 3, 2, 1]
~~~

Question 19

Array.sort()

Answer 19

Sorts the elements of an array** in place** and** returns the array**.

The default sort order is according to string Unicode code points.

// This make more sense 🤔
const array = ['D', 'B', 'A', 'C'];
array.sort(); // 😀 ['A', 'B', 'C', 'D']

// OR
const array = [4, 1, 3, 2, 10];
array.sort(); // 😧 [1, 10, 2, 3, 4]
array.sort((a, b) => a - b); // 😀 [1, 2, 3, 4, 10]

Question 20

Array.some()

Answer 20

Returns true if at least one element in the array passes the test implemented by the provided function.
~~~
// Code
const list = [1, 2, 3, 4, 5];
list.some((el) => el === 3); // true
list.some((el) => el === 6); // false
~~~

Question 21

Array.every()

a1.every(fn)

Answer 21

array.every is a built-in JavaScript method that checks if all elements in an array pass a certain condition, returning a boolean value of true or false. It takes in a callback function that returns a boolean value for each element in the array.

If all of these values are true, then array.every returns true. If at least one value is false, then it returns false.

// Code
const list = [1, 2, 3, 4, 5];
list.every((el) => el === 3); // false

const list = [2, 4, 6, 8, 10];
list.every((el) => el%2 === 0); // true

const numbers = [2, 4, 6, 8];

const areAllEven = numbers.every(num => num % 2 === 0);

console.log(areAllEven); // true

Question 22

Array.from()

Answer 22

**Creates ** a new array from an array-like or iterable object.

NEEDS: examples

Question 23

Array.of()

Answer 23

Creates a new array with a variable number of arguments, regardless of number or type of the arguments.

// Code
const list = Array.of(1, 2, 3, 4, 5);
list; // [1, 2, 3, 4, 5]

Question 24

Array.isArray()

Answer 24

Returns true if the given value is an array.
~~~
// Code
Array.isArray([1, 2, 3, 4, 5]); // true
Array.isArray(5); // false
~~~

Question 25

Array.at()

Answer 25

Returns a value at the specified index.

// Code
const list = [1, 2, 3, 4, 5];
list.at(1); // 2
list.at(-1); // 5
list.at(-2); // 4

Question 26

Array.copyWithin()

Answer 26

copyWithin() is a built-in JavaScript function that copies part of an array to another location.

This function modifies the original array in place and returns the modified array.

// Code
const myArray = [1, 2, 3, 4, 5, 6];

// Copy elements from position 0 to position 3
myArray.copyWithin(3);

console.log(myArray);
// Output: [1, 2, 3, 1, 2, 3]

// Copy elements from position 1 to position 4
myArray.copyWithin(4, 1);

console.log(myArray);
// Output: [1, 2, 3, 1, 2, 3]

// Copy elements from position 1 to position 3
myArray.copyWithin(3, 1, 3);

console.log(myArray);
// Output: [1, 2, 3, 2, 3, 3]

Question 27

Array.flat()

Answer 27

Returns a new array with all sub-array elements concatenated into it recursively up to the specified depth.

// Code
const list = [1, 2, [3, 4, [5, 6]]];
list.flat(Infinity); // [1, 2, 3, 4, 5, 6]

// Example 1

const arr = [1, 2, [3, 4]];
const flattened = arr.flat();

console.log(flattened); // Output: [1, 2, 3, 4]

// Example 2
const arr = [1, [2, [3, [4]]]];
const flattened = arr.flat();

console.log(flattened); // Output: [1, 2, [3, [4]]]

//Example 3
const arr = [1, [2, [3, [4]]]];
const flattened = arr.flat(Infinity);

console.log(flattened); // Output: [1, 2, 3, 4]

Question 28

Array.flatMap()

Answer 28

Array.prototype.flatMap() is a powerful array method that allows you to map and flatten an array in one step.

It works similarly to Array.prototype.map(), but it also **flattens the resulting array to a depth of 1.
**
This can be very useful when working with arrays of arrays or arrays of objects.

Here’s the syntax for Array.prototype.flatMap():

flatMap(function (element, index, array) { /* … */ }, thisArg)

The** callback** function takes three arguments: currentValue, index, and array. The thisArg parameter is optional, and it sets the this value of the callback function.

// Code
const list = [1, 2, 3];
list.flatMap((el) => [el, el * el]); // [1, 1, 2, 4, 3, 9]

NEEDS: better example

Question 29

Array.concat()

a1.concat(a2)

Answer 29

The concat() method creates a new array that contains the elements from the original array followed by the elements from the arguments passed to the method.

The original array is not modified.

// Code
const arr1 = [1, 2, 3];
const arr2 = [4, 5, 6];
const newArr = arr1.concat(arr2);
console.log(newArr); // Output: [1, 2, 3, 4, 5, 6]

Question 30

a1.join(separator)

Answer 30

Join all elements of array a1 into a string separated by separator arg

Question 31

a1.slice(start, end)

Answer 31

Extract a section from start to end of array a1 and return a new array

Question 32

a1.indexOf(obj)

Answer 32

Return first index of obj within array a1

Question 33

Array.lastIndexOf()

a1.lastIndexOf(obj)

Answer 33

Array.lastIndexOf is a built-in method in JavaScript that returns the index of the last occurrence of a specified value in an array.

This method searches the array from right to left, which means it starts from the end of the array and moves towards the beginning.

The syntax of Array.lastIndexOf is as follows:
~~~
array.lastIndexOf(searchValue)
array.lastIndexOf(searchValue, fromIndex)
~~~

Here, array is the array that you want to search in, searchValue is the value you want to find, and fromIndex (optional) is the index from which the search should begin. The fromIndex parameter specifies the starting position of the search. If fromIndex is **not **specified, the search starts from the end of the array.

If searchValue is found, Array.lastIndexOf returns the index of the last occurrence of the value. If the value is not found, the method returns -1.

Question 34

a1.every(fn)

Answer 34

Return true if every element in array a1 satisfies provided testing function fn

Question 35

Array.forEach()

a1.forEach(fn)

Answer 35

Array.prototype.forEach() is an array method that allows you to** loop through** each element of an array and perform a function on each element. This method can be useful for a variety of tasks, such as transforming data or logging information.

Syntax:
~~~
array.forEach(callback(currentValue, index, array), thisArg)
~~~

Here, array is the array that you want to loop through, callback is the function to be executed on each element of the array, and thisArg is the optional value to be used as this when executing the callback function.

The callback function takes** three parameters**: currentValue, index, and array. currentValue represents the value of the current element being processed, index represents the index of the current element being processed, and array represents the array that forEach() is being called on.

Question 36

a1.some(fn)

Answer 36

Return true if at least one element in array a1 satisfies provided testing function fn

Question 37

a1.map(fn)

Answer 37

Create a new array with results of calling function fn on every element in array a1

Question 38

a1.filter(fn)

Answer 38

Create a new array with all elements of array a1 which pass the filtering function fn

Question 39

a1.reduce(fn)

Answer 39

Apply a function fn against an accumulator and each value (from left to right) of the array as to reduce it to a single value

Question 40

a1.reduceRight(fn)

Answer 40

Apply a function fn against an accumulator and each value (from right to left) of the array as to reduce it to a single value

Question 41

a1.pop()

Answer 41

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

This method modifies the original array.

// Code
const myArray = [1, 2, 3, 4];
const lastElement = myArray.pop();

console.log(myArray); // prints [1, 2, 3]

console.log(lastElement); // prints 4

Question 42

a1.push(obj)

Answer 42

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

// Code
const myArray = [1, 2, 3, 4];
myArray.push(5);

console.log(myArray); // prints [1, 2, 3, 4, 5]

Question 43

a1.reverse()

Answer 43

Reverse order of elements of array a1 in place

Question 44

a1.sort()

Answer 44

Sort the elements of array a1 in place

Question 45

a1.splice(start, deleteCount, items)

Answer 45

Change content of array a1 by removing existing elements and/or adding new elements

Question 46

`a1.unshift(obj)

Answer 46

Add obj to start of array a1 and return new length

Question 47

Array.toString()

a1.toString()

Answer 47

Array.toString() is a built-in JavaScript method that returns a string representation of an array.

The returned string contains the elements of the array** separated by commas**, with no spaces between the elements.

//Example 
const fruits = ['apple', 'banana', 'cherry'];
const fruitsString = fruits.toString();

console.log(fruitsString); // "apple,banana,cherry"

Question 48

a1.toLocaleString()

Answer 48

Return a localized string representing array a1 and its elements (similar to a1.join(','))

Question 49

Array.isArray(var)

Answer 49

Return true if var is an array

Question 50

a1.length

Answer 50

The length property of an array returns the number of elements in the array. This property is** read-only**, which means that you can’t assign a new value to it.
~~~
// Code
const myArray = [1, 2, 3, 4];

console.log(myArray.length); // prints 4

myArray.length = 10; //throws an error
~~~

Question 51

a1[0]

Answer 51

Access first element of array a1

Question 52

Array.entries()

Answer 52

array.entries() is an array method in JavaScript that returns an iterator object which contains key-value pairs of the array.

The key-value pairs are returned as arrays where the** first element of the array is the index** and the second element is the value.
~~~
//Code
const fruits = [‘apple’, ‘banana’, ‘orange’];
const iterator = fruits.entries();

console.log(iterator.next().value); // [0, ‘apple’]
console.log(iterator.next().value); // [1, ‘banana’]
console.log(iterator.next().value); // [2, ‘orange’]
~~~

Question 53

Array.keys()

Answer 53

Array.keys() method returns an array iterator object that contains the keys for each index in the array. In other words, it returns an array of the indices of the given array.

Array.keys() can be called with** three different syntaxes**:
~~~
Syntax 1: Array.keys()

Syntax 2: Array.keys().next()

Syntax 3: Array.keys().map()
~~~

Question 54

Syntax 1: Array.keys()

Answer 54

The simplest syntax for Array.keys() is to call it with no arguments. This** returns an iterator object that contains the keys for each index in the array.**

Example:
~~~
const myArray = [‘apple’, ‘banana’, ‘orange’];
const keys = myArray.keys();

for (const key of keys) {
console.log(key);
}
~~~

Question 55

Syntax 2: Array.keys().next()

Answer 55

You can also call next() on the iterator object returned by Array.keys(). This returns an object that contains the value and done properties. The value property is the next key in the iterator, and the done property is a boolean that indicates whether the end of the iterator has been reached.

Example:
~~~
const myArray = [‘apple’, ‘banana’, ‘orange’];
const keys = myArray.keys();

let key = keys.next();
while (!key.done) {
console.log(key.value);
key = keys.next();
}
~~~

Question 56

Syntax 3: Array.keys().map()

Answer 56

Finally, you can also call map() on the iterator object returned by Array.keys(). This returns an array of the keys in the iterator.

Example:
~~~
const myArray = [‘apple’, ‘banana’, ‘orange’];
const keys = myArray.keys();

const keyArray = Array.from(keys).map(key => key * 2);
console.log(keyArray); //[0, 2, 4]
~~~
In this example, we call Array.from() on the iterator object returned by Array.keys() to convert it into an array. We then call map() on this array, which returns a new array containing each key multiplied by 2.