Array Methods in ES 6

ES 6 introduced the various new methods such as Array,from(), Array,of(). Here, we have the various array methods used in JavaScript, they are given below in the table format.

Sr. No.	Method	Description
1	every()	This method is used to return true if the elements of the array satisfy the given testing function.
2	concat()	It is used to return a new array that contains the two combined arrays.
3	forEach()	This method is used to call the function once for each value of an array.
4	filter()	This is used to return a new array function that involves the values to pass in the provided function condition.
5	join()	This method is used to join the array elements in the form of string.
6	indexof()	This method is used to find the particular element in the array, and it returns the index of the first match.
7	lastindex()	This method is used to find the particular element in the array, and it returns the index of the last match.
8	map()	It is used to invoke the particular function for the array value and return a new array.
9	push()	It is used to add one or more than one element in the last of array.
10	pop()	It is used to delete and return the last value of array.
11	splice()	It is used to add or delete the elements from or to an array.
12	sort()	This method is used to return the value of the given array in a sorted manner.
13	unshift()	This method is used to add one or more than one element at the starting of array.
14	reverse()	This method is used to reverse the value of an array.
15	slice()	This method is used to return a new array that involves a replica of the given array.
16	toString()	This method is used to return the string associated with all array values separated by comma (,).
17	isArray()	This method is used to check whether the given object is an array or not. This method returns true if the object is an array otherwise, false.
19	reduce()	This method is used to scale down the given array into a single value.
20	map()	This method is used to invoke the particular function for all array elements and return the new array.
21	some()	It returns the Boolean value. It returns true if the array element fulfills the given condition otherwise; it returns false.

Array Methods in ES 6

Here, we have some new array methods used in ES 6. They are given below-

Sr. No.	Array Method	Description
1	Array.form()	This method is used to change the iterable values into an array.
2	Array.of()	This method is used to build the instance from the variable with various arguments. It is not used to build an instance from a type of argument or the number of arguments.
3	Array.prototype.find()	This method is used to search the value based on the given conditions that are given to the method.
4	Array.prototype.copyWithin()	It is used to create the replica of an array at a different location but in the same array.
5	Array.prototype.findIndex()	This specific method is used to return the address or index of the first element of an array that fulfills the given conditions.
6	Array.prototype.entries()	This method is used to return an array iterator object used in the loop with the help of keys and array values.
7	Array.prototype.keys()	This method is used to return an array iterator object, including the keys of an array.
8	Array.prototype.fill()	This method is used to fill the particular array elements with a static value.
9	Array.prototype.values()	Array.prototype.values () method is used to serve the value to each key.

Here, we have a detailed description of these array methods with syntax and example-

Array.form()

The essential work of this method is to help to create a new array from an array-like object. This method is used to change the iterable values, includes a map and set and array-like values into an array.

Syntax

Array.form(object, mapFunction, thisValue)

Here, we are going to discuss the parameter values of the array method in brief.

Object: The object parameter is mandatory.

mapFunction: It is an optional parameter. It is a map function used to invoke each element of an array.

thisValue: It is an optional parameter to use. It can be used as a value during the execution of the mapFunction.

Example

let element = Array.from(‘Hello World’) 
 console.log (element)

Output

After the execution of the code, we got the following output:

Array.of()

In ES 5, when we pass a single numeric value in an array constructor, then it creates an array of that particular size. In ECMAScript 6, the Array.of() is used to create an array that stabilizes this problem.

With the help of the Array.of() method, if we create an array with a single numeric value, it takes the passed value as an array element, not as the size of an array.

Example

let value = Array.of(20)
 console.log(value)
 console.log(value.length)

Output

After the execution of the code, we got the following output:

Array.prototype.find()

It is a new feature in ECMAScript 6. This method is used to search value from an array based on a particular parameter passed to this method. This method returns the first element of array that fulfills the mentioned conditions.

Syntax

Array.find(callback(currentValue, index, arr), thisValue)

Here, we have discussed the parameter values of the array method in brief.

callback: It is used to present the function that is used to execute the elements of an array.

currentValue(): It is the value of the current parameter. It is a mandatory parameter.

index: It is also used as an optional parameter.

thisValue: It is a value used as this duringthe implementation of the callback.

Example

var array = [4, 20, 17, 23, 34];
 var res = arr.find(x=>x>18)
 console.log (res);

Output

After the execution of the above code, we got the following output:

Array.prototype.copyWithin()

It is a new method included in ECMAScript 6. This method is used to create the replica of an array at a different location inside the same array. This method only returns the altered array with the same length.

Important Point: The Array.prototype.copy.Within () method do not add the elements in an array. It only overwrites the array elements.

Syntax

 Array.copyWithin(target, start, end)

Here, we will try to understand the parameters of the above method.

target: It is used as a necessary parameter in an array method. This method is considered as the index position that helps to copy an array element.

start: It is used as an optional parameter. It is similar to the index position used to start the replication process. Its initial value is 0. If the value of start is negative (-ve), then we consider the start from the last end of array.

end: This parameter is used to stop the replication of array elements. The initial value of the end is the length of the array. This array method is used as an optional method.

Example

Here, we have an example to understand the concept of this array method.

const value = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10];
 const value1 = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10];
 const value2 = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10];
 console.log (value.copy.Within(1, 3, 5));
 console.log (value1.copy.Within(1, 3));
 console.log (value2.copy.Within(1));

Output

After the execution of the code, we got the following output:

Array,prototype.findIndex()

This method is used to return the address of the first element of an array. If there is no element that fulfills the given condition, the method returns the value -1.

Syntax

Array.findIndex(callback(value, index, arr), this args)

Example

We have an example to illustrate this array method.

var array = [8, 20, 18, 22, 32];
 var res = arr.findIndex(x=>x>19);
 console.log (res)

Output

After the successful execution of the code, we got the following output:

Array.prototype.entries()

The Array.prototype.entries method is used to return the iterator object. This loops the object by using values of array and keys.

The parameter entries is used to return the array of an array. In the array, every derived array is an array of values and indexes.

Syntax

array.entries()

Example

var colors = [‘Green’, ‘Yellow’, ‘Blue’, ‘Pink’, ‘Black’];
 var display = color.entries();
 for (a of display)
 {
           console.log (a);
 }

Output

After the execution of the code, we got the following output:

We can also execute the above code with the help of the spread operator.

Example

var color = [‘Brown’, ‘Red’, ‘Grey’, ‘Black’];
 var display = color.entries();
 console.log (…display);

Output

After the execution of the code, we got the following output:

Array.prototype.keys()

This method is used to return an array iterator object associated with array keys. Array.prototype.keys() method is similar to array.prototype.entries () method.

Syntax

Array.keys()

Example

var animals = [‘Lion’, ‘Tiger’, ‘Dog’, ‘Cow’, ‘Horse’];
 var display = animals.key();
 console.log (…display);

Output

After the execution of the code, we got the following output:

Array.prototype.fill()

Array.prototype.fill () method is used to give the value to the particular array element. This value is used to fill the array. This method alters the original value.

Syntax

array.fill(value, start, end)

Here, we will try to understand the parameters of the above method.

value: It is a mandatory parameter. This parameter is used to fill an array.

start: It is the address that is used to start value allocation to an array. It has 0 as the default value. It is an optional parameter.

end: It is the address used to stop value allocation to an array.The default value of this parameter is array length. It is an optional parameter.

Example

We have an example to understand this array method.

var animal = [‘Dog’, ‘Cat’, ‘Horse’, ‘Tiger’];
 var display = animal.fill(“Cow”, 2, 4);
 console.log (…display);

Output

ECMAScript6 Tutorial

ECMAScript6 Tutorial

Array Methods in ES6