Getting started with JavaScript Array Functions

javascript array functionsAn array is one of the most common and essential data types that are used for storing collection of data of any type and for implementing a complex data structures like stacks and queues. It enables the programmer to save multiple values of same type that is either all strings or all integer values in a single variable. In JavaScript, the array serves the same purpose, but here arrays can have multiple types of data in one array. The ‘Array’ class provides different JavaScript Array methods to create and manipulate the ‘Array’ object.

What are JavaScript Array Methods?

JavaScript Array Methods are a set of methods that are used to instantiate the ‘Array’ class, modify and search its elements, and format and retrieve the content of an array.

Interested in learning more about JavaScript? Check out a course at Udemy.com.

Constructors in JavaScript Array Methods

Constructors are the special JavaScript Array methods used to instantiate the ‘Array’ class. The following are the formats of available constructors:

var array_Object = new Array ()

var array_Object = new Array (size_Of_Array)

var array_Object = new Array ([element0 [, element1 [, ... [, elementN ]]]])

In the above example of JavaScript Array constructors, the ‘Array’ object is assigned to a variable ‘array_Object’. The first constructor creates an ‘Array’ object with an element length of zero whereas the second one uses the ‘size_Of_Array’ as parameter to assign the specified number of empty slots for elements of an ‘Array’. Finally, the ‘Array’ object is created with a zero-based elements provided as a parameter in the constructor. Since indexing in ‘Array’ object is zero-based, the ‘Array’ object created in the last constructor has a length of n + 1 elements.

 

JavaScript Array Method ‘concat’

var array_Object = array.concat ([item1 [, item2 [, ... [, itemN ]]]])

The ‘concat’ method of a JavaScript Array is used to join arrays (two or more). In the above example, the returned value is a joined Array object of the items  such as strings or arrays that are passed as an argument, concatenated at end of the ‘array’. An example is as follows:

Code snippet:

var a, b, c, d, e;

a = new Array ("JavaScript", "Array", "Methods");

b = 1;

c = "is";

d = new Array ("Concat", "Method");

e = a.concat (b, c, d);

alert (e);

JavaScript Array Method ‘every’, ‘filter’, ‘forEach’ and ‘map’

var bool_Result = array.every (callback_Function)

function callback_Function (element_Value, numeric_Element_index, array_Object)

JavaScript Array ‘every’ method is used to perform a test on all of the elements in array. Test is implemented as a function. The ‘every’ method returns  ‘true’ or ‘false’ based on the tests perform in a callback function usually on the ‘element_value’ parameter. The following code snippet demonstrates the test of a maximum limit (in this example, 100 is the limit) on all the numeric elements of array.

Code Snippet:

function IsInLimit (value, index, ar) {

if (value < 100)

return true;

else {

alert ("value "+ value + " on index: "+ index + " has crossed the limit");

return false;

}

}

var numbersArray = [20, 44, 49, 68, 150];

if (numbersArray.every (IsInLimit))

return "Maximum limit is satisfied";

The JavaScript Array ‘filter’ method is similar to the ‘every’ method, but instead of a ‘true’ or ‘false’ response, it returns the array with elements that passed the test in the callback function. Unlike the ‘every’ and ‘filter’ methods, ‘forEach’ calls a callback function for every element in an array with no return value. The ‘map’ method calls a callback function on each element of an array and returns the array that contains the result set of all elements. The following are the formats of ‘filter’, ‘forEach’ and ‘map’ methods.

var array_Object = array.filter (callback_Function)

array.forEach (callback_Function)

var array_Object_With_Resultant_Elements = array.map (callback_Function)

To learn JavaScript in detail, look at courses at Udemy.com.

JavaScript Array Methods 'indexOf' and 'lastIndexOf' 

var index = array.indexOf (element_To_Search, [search_Start_Index])

var index = array.lastIndexOf (element_To_Search, [search_Start_Index])

In JavaScript Array methods, the ‘indexOf’ and ‘lastIndexOf’ are the searching methods used to find out the index of a specified element in an array. In the ‘indexOf’ method, search starts from a zero index or specified optional index of an array and ends at the last index of an array whereas in ‘lastIndexOf’ method, search starts from the last index or specified optional index and ends at the zero index of an array. Both methods return the index of element on a first match or ‘-1’ when an element to search is not present in an array. The following code snippet demonstrate these concepts:

Code snippet:

var index = [12, 5, 8, 130, 8].indexOf (8);

alert ("index is : " + index ); //2

 

var index = [12, 5, 8, 130, 8].indexOf (13);

alert ("index is : " + index ); //-1

 

var index = [12, 5, 8, 130, 8].lastIndexOf (8);

alert ("index is : " + index ); //4

JavaScript Array Methods ‘pop’ and ‘push’

var element_Of_array = array.pop ();

var index_New_Element = array.push ([item1 [, item2 [, ... [, itemN ]]]]);

JavaScript Array method ‘pop’ is used to delete an element from the end of an array index and returns it. On the contrary, the ‘push’ method inserts an item (strings, numeric value, arrays, etc.) at the end of an array index and returns new length of an array. The following example shows the implementation of these methods.

Code snippet:

var sample_Numbers = [7, 14, 21, 28];

var sample_Array = [35, 42];

 

var element = sample_Numbers.pop ();

alert ("element is : " + element ); //28

 

element = sample_Numbers.pop ();

element = sample_Numbers.pop ();

alert ("element is : " + element ); //14

 

alert (sample_Numbers); //7

 

element = sample_Numbers.push (14,"Twenty One");

element = sample_Numbers.push (28);

element = sample_Numbers.push (sample_Array);

 

alert (sample_Numbers); // 7,14,Twenty One,28,35,42

JavaScript Array Methods ‘shift’ and ‘unshift’

The ‘push’ and ‘pop’ methods modify the array at the last index. In contrast, the ‘shift’ and ‘unshift’ methods of JavaScript Array remove and add elements respectively at the start of an array.

For more JavaScript tutorials, take a course at Udemy.com.