Array In JavaScript

Array In JavaScript

Table of contents

No heading

No headings in the article.

Array

JavaScript array is an object that represents a collection of similar type of elements.

There are several ways to construct array in JavaScript:

  1. By array literal
  2. By creating instance of Array directly (using new keyword)

Why Use Arrays?

If you have a list of items (a list of country names, for example), storing the country in single variables could look like this:

let cat1 = "India";
let cat2 = "Japan";
let cat3 = "France";

However, what if you want to loop through the country and find a specific one? And what if you had not 3 country, but 100?

The solution is an array!

An array can hold many values under a single name, and you can access the values by referring to an index number.

1) JavaScript array literal

The syntax of creating array using array literal is given below:

var arrayname=[value1,value2.....valueN];

NOTE It is a common/good practice to declare arrays with the const keyword.

As you can see, values are contained inside [ ] and separated by , (comma). Let's see the simple example of creating and using array in JavaScript.

var emp=["Sonoo","Vimal","Ratan"];  
for (i=0;i<emp.length;i++){  
console.log([i]);  
}

The .length property returns the length of an array ^ .

Output of the above example

Sonoo
Vimal
Ratan

JavaScript new Array()

JavaScript has a built in array constructor new Array(). But you can safely use [] instead. These two different statements both create a new empty array named points:

const points = new Array();
const points = [];

These two different statements both create a new array containing 6 numbers:

const points = new Array(40, 100, 1, 5, 25, 10);
const points = [40, 100, 1, 5, 25, 10];

The new keyword can produce some unexpected results:

const points = new Array(40, 100, 1);

Array Elements Can Be Objects

JavaScript variables can be objects. Arrays are special kinds of objects. Because of this, you can have variables of different types in the same Array. You can have objects in an Array. You can have functions in an Array. You can have arrays in an Array:

myArray[0] = Date.now;
myArray[1] = myFunction;
myArray[2] = myCars;

The Difference Between Arrays and Objects

In JavaScript, arrays use numbered indexes.
In JavaScript, objects use named indexes. Arrays are a special kind of objects, with numbered indexes.

When to Use Arrays. When to use Objects.

  1. JavaScript does not support associative arrays.
  2. You should use objects when you want the element names to be strings (text).
  3. You should use arrays when you want the element names to be numbers.

JavaScript Array Methods

  1. concat() - It returns a new array object that contains two or more merged arrays.

  2. copywithin() - It copies the part of the given array with its own elements and returns the modified array.

  3. entries() - It creates an iterator object and a loop that iterates over each key/value pair.

  4. every() - It determines whether all the elements of an array are satisfying the provided function conditions.

  5. flat() - It creates a new array carrying sub-array elements concatenated recursively till the specified depth.

  6. flatMap() - It maps all array elements via mapping function, then flattens the result into a new array.

  7. fill() - It fills elements into an array with static values.

  8. from() - It creates a new array carrying the exact copy of another array element.

  9. filter() - It returns the new array containing the elements that pass the provided function conditions.

  10. find() - It returns the value of the first element in the given array that satisfies the specified condition.

  11. findIndex() - It returns the index value of the first element in the given array that satisfies the specified condition.

  12. forEach() - It invokes the provided function once for each element of an array.

  13. includes() - It checks whether the given array contains the specified element.

  14. indexOf() - It searches the specified element in the given array and returns the index of the first match.

  15. isArray() - It tests if the passed value ia an array.

  16. join() - It joins the elements of an array as a string.

  17. keys() - It creates an iterator object that contains only the keys of the array, then loops through these keys.

  18. lastIndexOf() - It searches the specified element in the given array and returns the index of the last match.

  19. map() - It calls the specified function for every array element and returns the new array.

  20. of() - It creates a new array from a variable number of arguments, holding any type of argument.

  21. pop() - It removes and returns the last element of an array.

  22. push()- It adds one or more elements to the end of an array.

  23. reverse() - It reverses the elements of given array.

  24. reduce(function, initial) - It executes a provided function for each value from left to right and reduces the array to a single value.

  25. reduceRight() - It executes a provided function for each value from right to left and reduces the array to a single value.

  26. some() - It determines if any element of the array passes the test of the implemented function.

  27. shift() - It removes and returns the first element of an array.

  28. slice() - It returns a new array containing the copy of the part of the given array.

  29. sort() - It returns the element of the given array in a sorted order.

  30. splice() - It add/remove elements to/from the given array.

  31. toLocaleString() - It returns a string containing all the elements of a specified array.

  32. toString() - It converts the elements of a specified array into string form, without affecting the original array.

  33. unshift() - It adds one or more elements in the beginning of the given array.

  34. values() - It creates a new iterator object carrying values for each index in the array.