Open In App

JavaScript Indexed Collections

Improve
Improve
Improve
Like Article
Like
Save Article
Save
Share
Report issue
Report

Javascript Indexed Collections are collections that have numeric indices i.e. the collections of data that are ordered by an index value. In JavaScript, an array is an indexed collection. An array is an ordered set of values that has a numeric index.

For example, an array called ‘student’ contains the name of the students and the index values are the Roll Numbers of the students. JavaScript does not have an explicit array data type. However, we can use the predefined Array object in JavaScript and its methods to work with arrays. 

Creating an Array: There are many ways to create and initialize an array that is listed below:

  • Creating arrays without defining the array length. In this case, the length is equal to the number of arguments.

Syntax:

let arr = new Array( element0, element1, ... );   
let arr = Array( element0, element1, ... );       
let arr = [ element0, element1, ... ];  
  • Creating an array with the given size

Syntax:

let arr = new Array(6); 

let arr = Array(6);

let arr = [];
arr.length = 6;
  • Create a variable-length array and add many elements as you need.
// First method: Initialize an empty
// array then add elements
let students = [];
students [0] = 'Sujata Singh';
students [1] = 'Mahesh Kumar';
students [2] = 'Leela Nair';
 
// Second method: Add elements to
// an array when you create it
let fruits = ['apple', ‘mango', 'Banana'];

The methods that can be applied over arrays are:

Method 1: Accessing the Array Elements

Use indices to access array elements. Indices of Arrays are zero-based which means the index of the elements begins with zero. 

javascript




let fruits = ['Apple', 'Mango', 'Banana'];
console.log(fruits [0]);
console.log(fruits[1]);


Output

Apple
Mango

Method 2: Obtaining array length

To obtain the length of an array use array_name.length property

javascript




let fruits = ['Apple', 'Mango', 'Banana'];
console.log(fruits.length)


Output

3

Method 3: Iterating over arrays

There are many ways to iterate the array elements.

  • JavaScript for loop: for loop provides a concise way of writing the loop structure. Unlike a while loop, a for statement consumes the initialization, condition, and increment/decrement in one line thereby providing a shorter, easy-to-debug structure of looping. 

javascript




const fruits = ['Apple', 'Mango', 'Banana'];
for (let i = 0; i < fruits.length; i++) {
    console.log(fruits[i]);
}


Output

Apple
Mango
Banana
  • JavaScript forEach() Loop: The forEach() function provides once for each element of the array. The provided function may perform any kind of operation on the elements of the given array. 

javascript




const fruits = ['Apple', 'Mango', 'Banana'];
fruits.forEach(function (fruit) {
    console.log(fruit);
});


Output

Apple
Mango
Banana

javascript




const fruits = ['Apple', 'Mango', 'Banana'];
fruits.forEach(fruit => console.log(fruit));


Output

Apple
Mango
Banana

Method 4: Array Methods

There are various array methods available to us for working on arrays. These are:

  • JavaScript push() Method: This method adds one or more elements to the end of an array and returns the resulting length of the array. 

javascript




let numbers = new Array('1', '2');
numbers.push('3');
console.log(numbers);


Output

[ '1', '2', '3' ]

javascript




let numbers = new Array('1', '2', '3');
let last = numbers.pop();
console.log(last);


Output

3

javascript




let myArray = new Array('1', '2', '3');
myArray = myArray.concat('a', 'b', 'c');
console.log(myArray);


Output

[ '1', '2', '3', 'a', 'b', 'c' ]

javascript




let students = new Array('john', 'jane', 'joe');
let list = students.join(' - ');
console.log(list);


Output

john - jane - joe

javascript




let myArray = new Array('West', 'East', 'South');
myArray.sort();
console.log(myArray);


Output

[ 'East', 'South', 'West' ]
  • JavaScript indexOf() Method: This method searches the array for an Element and returns the index of the first occurrence of the element. 

javascript




let myArr = ['a', 'b', 'a', 'b', 'a'];
console.log(myArr.indexOf('b'));


Output

1

javascript




let myArr = new Array('a', 'b', 'c');
let first = myArr.shift();
console.log(first);


Output

a
  • JavaScript reverse() Method: This method reverses the first array element become the last and the last becomes the first. It transposes all the elements in an array in this manner and returns a reference to the array. 

javascript




let myArr = new Array('a', 'b', 'c');
myArr.reverse();
console.log(myArr);


Output

[ 'c', 'b', 'a' ]
  • JavaScript map() Method: This method returns a new array of the returned value from executing a function on every array item. 

javascript




let myArr1 = ['a', 'b', 'c'];
let a2 = myArr1.map(function (item) {
    return item.toUpperCase();
});
console.log(a2);


Output

[ 'A', 'B', 'C' ]

javascript




let myArr1 = ['a', 10, 'b', 20, 'c', 30];
 
let a2 = myArr1.filter(function (item) {
    return typeof item === 'number';
});
 
console.log(a2);


Output

[ 10, 20, 30 ]




Last Updated : 11 Jul, 2023
Like Article
Save Article
Previous
Next
Share your thoughts in the comments
Similar Reads