What is an Array?
An Array is a simple data structure that contains multiple values. Array in JavaScript can store values with any types of datatypes.
Creating an Array:
Syntax:
const arrayName = [element1, element2, element3];
Example:
const countries = ["INDIA", "UK", "USA", "JAPAN", "CHINA"];
console.log(countries);
//Output: [ 'INDIA', 'UK', 'USA', 'JAPAN', 'CHINA']
In JavaScript array is an object. We can use typeOf operator to see the data type of Array.
console.log(typeof countries);
// Output: object
Access the element of an Array:
Arrays have zero based indexed system. It means index of first element is 0 ,index of second element is 1 ,index of third element is 2 and so on.
We can access the element of array by its index.
Example:
console.log(countries[0]); //India
console.log(countries[1]); //UK
console.log(countries[2]); //USA
Getting the Array size:
We can also find out length of an array by using .length property of array.
const countries = ["India", "UK", "USA", "JAPAN", "CHINA"];
console.log(countries.length);
//Output:5
Update the element of an Array:
We can also update value of any element in an array. If we want to update the value element which is at index 3.
const countries = ["India", "UK", "USA", "JAPAN", "CHINA"];
countries[3] = "GERMANY";
console.log(countries);
//Output:[ 'India', 'UK', 'USA', 'GERMANY', 'CHINA' ]
//The value of third index changed to "GERMANY" from "JAPAN".
Basic Array operations:
1.push()
The push() method add elements to the end of an Array. The push()method also change original Array. It returns the new length of Array.
const countries = ["India", "UK", "USA", "JAPAN", "CHINA"];
countries.push("FRANCE", "SPAIN");
console.log(countries);
//Output: [ 'India', 'UK', 'USA', 'JAPAN', 'CHINA', 'FRANCE', 'SPAIN']
console.log(countries.length); // Now length of array is 7.
2.pop()
The pop() method remove the last elements from the end of an Array. The pop()method also change the original Array. It returns the remove element of Array.
const countries = ["India", "UK", "USA", "JAPAN", "CHINA"];
countries.pop();
console.log(countries);
// Output: [ 'India', 'UK', 'USA', 'JAPAN' ]
console.log(countries.pop()); // JAPAN
// pop() method returns the last element of array i.e JAPAN.
3.unshift()
The unshift() method adds one or more elements to the beginning of an Array. The unshift() method also change the original Array. It returns the new length of the Array.
const countries = ["India", "UK", "USA", "JAPAN", "CHINA"];
countries.unshift("SRI LANKA", "BANGLADESH");
console.log(countries);
//Output: [ 'SRI LANKA', 'BANGLADESH', 'India', 'UK', 'USA', 'JAPAN', 'CHINA' ]
console.log(countries.unshift("SRI LANKA", "BANGLADESH")); // 7.Now the length of Array is 7.
4.shift()
The shift() method removes the first element from an Array. The shift() method also change the original Array. It returns removed element.
const countries = ["India", "UK", "USA", "JAPAN", "CHINA"];
countries.shift();
console.log(countries);
//Output: [ 'UK', 'USA', 'JAPAN', 'CHINA' ]
console.log(countries.shift()); // UK. It removed the first element from modified array.
5.concat()
The concat() method is used to merge two or more Arrays. This method returns a new Array, it does not change the existing Array.
const countries1 = ["India", "UK", "USA", "JAPAN", "CHINA"];
const countries2 = ["FRANCE", "GERMANY", "PORTUGAL", "ARGENTINA"];
const countries3 = ["SOUTH AFRICA", "SOUTH KOREA", "BANGLADESH"];
const newCountries = countries1.concat(countries2, countries3);
console.log(newCountries);
//Output: [ 'India', 'UK', 'USA', 'JAPAN', 'CHINA', 'FRANCE', 'GERMANY', 'PORTUGAL', 'ARGENTINA', 'SOUTH AFRICA', 'SOUTH KOREA', 'BANGLADESH'
]
console.log(countries1);
// [ 'India', 'UK', 'USA', 'JAPAN', 'CHINA' ] See conact() method does not change the first array. It returns the same array.
6.indexOf()
The indexof() method returns the first position of an element that can be found in array. If the particular element present multiple times in array, indexof() method only returns index of first occurrence of that element. If any element is not present in an array it returns -1.
const countries = ["INDIA", "UK", "USA", "INDIA", "JAPAN", "CHINA", "INDIA"];
console.log(countries.indexOf("UK")); // 1
console.log(countries.indexOf("INDIA")); // 0
console.log(countries.indexOf("GERMANY")); // -1
Conclusion:
This is just an introductory guide of Array and it's basic methods. Check out this resources for more comprehensive overview.
If this article helps you please let me know in the comments.