Table of contents
First things first, we will discuss what is an Array, and its construction.
What is an Array?
An array is used to store multiple values in a single variable. This is compared to a variable that can store only one value. Each item in an array has a number attached to it, called a numeric index, that allows you to access it. In JavaScript, arrays start at index zero and can be manipulated with various methods.
Unlike other programming languages, JavaScript allows us to insert different datatype values into a single array. Because Array in JavaScript is an Object.
Array Declaration:
Syntax:
const birds = []; // Using Array Literal
const birds1 = new Array(); // Using new Object Constructor
Array Initialization
const birds = ["Sparrow", "Peacock", "Hen", "Kingfisher"];
const values = [24, "Vasu", 22, "Sreenivas", 45, 64];
Access an array item by its index
const birds = ["Sparrow", "Peacock", "Hen", "Kingfisher"];
// The index of an array's first element is always 0.
birds.[0]; // Sparrow
// // The index of an array's second element is always 1.
birds.[1]; // Peacock
// The index of an array's third element is always 2.
birds.[2]; // Hen
// The index of an array's fourth element is always 3.
birds.[3]; // Kingfisher
// The index of an array's last element is always one
// less than the length of the array.
birds[birds.length - 1] // Kingfisher
// Using an index number larger than the array's length
// returns 'undefined'.
birds[10]; // undefined
Yeah, enough of the talk, that's the basic introduction to the Array construct.
Now, let us see some of the Array Methods in Javascript.
Array.at()
The at() method takes an integer value and returns the item at that index, allowing for positive and negative integers. Negative integers count back from the last item in the array.
Syntax:
arr.at(indexNumber);
const birds = ["Sparrow", "Peacock", "Hen", "Kingfisher"];
birds.at(0); // Sparrow
birds.at(1); // Peacock
birds.at(-2); // Hen
birds.at(-1); // Kingfisher
Array.includes()
The Javascript array. includes() method is used to know whether a particular element is present in the array or not and accordingly, it returns true or false i.e, if the element is present, then it returns true otherwise false.
Syntax:
arr.includes(searchElement);
arr.includes(searchElement, fromIndex);
searchElement: The element which is going to be searched.
fromIndex: Zero-based index at which to start searching.
Example:
const birds = ["Sparrow", "Peacock", "Hen", "Kingfisher"];
console.log(birds.includes("Hen"));
console.log(birds.includes("Parrot"));
console.log(birds.includes("Hen", 1));
console.log(birds.includes("Hen", 2));
console.log(birds.includes("Hen", 3));
Output:
true
false
true
true
false
Array.concat()
The concat() method is used to merge two or more arrays. This method does not change the existing arrays, but instead returns a new array.
Syntax:
arr1.contact(arr2);
Example:
const birds = ["Sparrow", "Peacock", "Hen", "Kingfisher"];
const birds2 = ["Parrot", "Humming Bird", "Crow"];
console.log(birds.concat(birds2));
Output:
[
'Sparrow',
'Peacock',
'Hen',
'Kingfisher',
'Parrot',
'Humming Bird',
'Crow'
]
Array.slice()
The slice() method returns selected elements in an array, as a new array. The slice() method selects from a given start, up to a (not inclusive) given end. The slice() method does not change the original array.
Syntax:
arr.slice(startIndex, endIndex);
arr.slice(index);
// Note: If there is a single index value, then it would be taken as startIndex, without having endIndex.
Example:
const birds = ["Sparrow", "Peacock", "Hen", "Kingfisher"];
console.log(birds.slice(3));
console.log(birds.slice(0, 2));
console.log(birds.slice(-1));
console.log(birds.slice(-2));
console.log(birds.slice(2));
Output:
[ 'Kingfisher' ]
[ 'Sparrow', 'Peacock' ]
[ 'Kingfisher' ]
[ 'Hen', 'Kingfisher' ]
[ 'Hen', 'Kingfisher' ]
Array.splice()
The splice() method is a built-in method for JavaScript Array objects. It lets you change the content of your array by removing or replacing existing elements with new ones. This method modifies the original array and returns the removed elements as a new array.
Syntax:
arr.splice(start, deleteCount, item1, item2, itemN);
start: is a zero-based index, which can accept both positive and negative values, negative values are counts back of the array index.
deleteCount: An integer indicating the number of elements in the array to remove from start.
item: item here refers to the array item which should be added.
Example:
const birds = ["Sparrow", "Peacock", "Hen", "Kingfisher"];
console.log(birds.splice(2, 2));
console.log(birds.splice(1, 1, "Parrot"));
console.log(birds.splice(0, 2, "Parrot", "Humming Bird"));
Output:
[ 'Hen', 'Kingfisher' ]
[ 'Peacock' ]
[ 'Sparrow', 'Parrot' ]
// Note:The above output result vaues are not the birds arrays values, they are removed values using splice method.
Array.push()
The push() method adds one or more elements to the end of an array and returns the new length of the array.
Syntax:
arr.push(value);
arr.push(value1, value2);
Example:
const birds = ["Sparrow", "Peacock", "Hen", "Kingfisher"];
console.log(birds);
console.log(birds.push("Parrot"));
console.log(birds);
console.log(birds.push("Parrot", "Humming Bird"));
console.log(birds);
console.log(birds.push("Parrot", "Humming Bird", "Crow"));
console.log(birds);
Output:
[ 'Sparrow', 'Peacock', 'Hen', 'Kingfisher' ]
5
[ 'Sparrow', 'Peacock', 'Hen', 'Kingfisher', 'Parrot' ]
7
[
'Sparrow',
'Peacock',
'Hen',
'Kingfisher',
'Parrot',
'Parrot',
'Humming Bird'
]
10
[
'Sparrow', 'Peacock',
'Hen', 'Kingfisher',
'Parrot', 'Parrot',
'Humming Bird', 'Parrot',
'Humming Bird', 'Crow'
]
Array.pop()
The pop() method removes the last element from an array and returns that element. This method changes the length of the array.
Syntax:
arr.pop();
// Note: The removed element from the array is undefined if the array is empty.
Example:
const birds = ["Sparrow", "Peacock", "Hen", "Kingfisher"];
const popped = birds.pop();
console.log(birds);
console.log(popped);
Output:
[ 'Sparrow', 'Peacock', 'Hen' ]
Kingfisher
Array.indexOf()
The indexOf() method returns the first index at which a given element can be found in the array, or -1 if it is not present.
Syntax:
arr.indexOf(searchElement);
arr.indexOf(searchElement, fromIndex);
Example:
const birds = ["Sparrow", "Peacock", "Hen", "Kingfisher", "Hen"];
console.log(birds.indexOf("Hen"));
console.log(birds.indexOf("Parrot"));
console.log(birds.indexOf("Hen", 0));
console.log(birds.indexOf("Hen", 3));
Output:
2
-1
2
4
Array.isArray()
The Array.isArray() static method determines whether the passed value is an Array.
Syntax:
arr.isArray(value);
value: the values to be checked.
Example:
const birds = ["Sparrow", "Peacock", "Hen", "Kingfisher"];
console.log(Array.isArray(birds));
console.log(Array.isArray(["Sparrow", "Peacock", "Hen", "Kingfisher"]));
Output:
true
true
Array.join()
The JavaScript Array join() Method is used to join the elements of an array into a string. The elements of the string will be separated by a specified separator and its default value is a comma(, )
Syntax:
arr.join();
arr.join(separator);
Example:
const birds = ["Sparrow", "Peacock", "Hen", "Kingfisher"];
console.log(birds.join());
console.log(birds.join(", "));
console.log(birds.join(" + "));
Output:
Sparrow,Peacock,Hen,Kingfisher
Sparrow, Peacock, Hen, Kingfisher
Sparrow + Peacock + Hen + Kingfisher
Array.lastIndexOf()
The Array.lastIndexOf() method returns the last index at which a given element can be found in the array, or -1 if it is not present. The array is searched backwards, starting at fromIndex.
Syntax:
arr.lastIndexOf(searchElement);
arr.lastIndexOf(searchElement, fromIndex);
Example:
const birds = ["Sparrow", "Peacock", "Hen", "Kingfisher", "Sparrow"];
console.log(birds.lastIndexOf("Hen"));
console.log(birds.lastIndexOf("Sparrow"));
console.log(birds.lastIndexOf("Parrot"));
Output:
2
4
-1
Array.reverse()
The reverse() method reverses the order of the elements in an array. The reverse() method overwrites the original array.
Syntax:
arr.reverse();
Example:
const birds = ["Sparrow", "Peacock", "Hen", "Kingfisher"];
console.log(birds);
console.log(birds.reverse());
Output:
[ 'Sparrow', 'Peacock', 'Hen', 'Kingfisher' ]
[ 'Kingfisher', 'Hen', 'Peacock', 'Sparrow' ]
Array.shift()
The shift() method removes the first element from an array and returns that removed element. This method changes the length of the array.
Syntax:
arr.shift();
Example:
const birds = ["Sparrow", "Peacock", "Hen", "Kingfisher"];
console.log(birds);
console.log(birds.shift());
console.log(birds);
console.log(birds.shift());
console.log(birds);
console.log(birds.shift());
console.log(birds);
Output:
[ 'Sparrow', 'Peacock', 'Hen', 'Kingfisher' ]
Sparrow
[ 'Peacock', 'Hen', 'Kingfisher' ]
Peacock
[ 'Hen', 'Kingfisher' ]
Hen
[ 'Kingfisher' ]
Array.unshift()
The unshift() method adds one or more elements to the beginning of an array and returns the new length of the array.
Syntax:
arr.unshift(elemenat0);
arr.unshift(element0, element1);
arr.unshift(element0, element1, /* … ,*/ elementN);
Example:
const birds = ["Sparrow", "Peacock", "Hen", "Kingfisher"];
birds.unshift("Parrot");
console.log(birds);
birds.unshift("Humming Bird", "Crow");
console.log(birds);
Output:
[ 'Parrot', 'Sparrow', 'Peacock', 'Hen', 'Kingfisher' ]
[
'Humming Bird',
'Crow',
'Parrot',
'Sparrow',
'Peacock',
'Hen',
'Kingfisher'
]
Array.toString()
The toString() method returns a string representing the specified array and its elements.
Syntax
arr.toString();
Example:
const values = [24, "Vasu", 22, "Sreenivas", 45, 64];
values.toString();
console.log(values);
Output:
[ 24, 'Vasu', 22, 'Sreenivas', 45, 64 ]
Yeah, that's all about some of the JavaScript Array Methods.
If you want to learn more about JavaScript Array Methods
You can check here Check Here
