Crus4

logo

JavaScript Arrays


JavaScript Arrays is a data structure that is used to collect the elements of same Data Type. Arrays are the great way to store and manipulate collections of data. Here is a syntax of JavaScript array:

Syntax:

let array_name = ["item1", "item2", "item3",------];

Why Use Arrays

If you have any type of list (let’s say list of students), and your task is to save the names of all the students. You will surely store the names of those students as:

let stud1 ="Ravi";
let stud2 = "Abdullah";
let stud3 = "David";
and so on....

But their may be thousand of students in a school. Would you create thousand variables to store their name. That is why we use arrays. By using a JavaScript Arrays, the above code will look like this:

let Array_name = ["Ravi", "Abdullah", "David"];

You can see that the above code is much shorter easy to read then the previous one.

An array can hold thousand of values under a single name, and you can access any particular value by referring to an index number. We will learn more about it, later in this tutorial.

Creating an Array in JavaScript

There are two ways to create an array in JavaScript. Using the new Array() constructor and using a square brackets [ ] .

Using Square Brackets [ ]

Creating an Array in JavaScript is so easy. Here is the Syntax;

let Array-Name = ["prod1", "prod2", "prod3"....];

However, we can also create an array using the JavaScript new Array() constructor, but it’s a good practice to create arrays using square brackets.

Spaces in arrays are not mandatory, we can also add the above code as follows:

let Array-Name = ["prod1","prod2","prod3"....] 
// and
let Array-Name = ["prod1", 
"prod2",
 "prod3"
 ....];

Using new Array() Constructor

We can also create an JavaScript like this:

let studts = new Array("Ravi", "Abdullah", "David");

Accessing Elements in an Array

As I already told you, we can access elements in an array using the index numbers. The first element of an array has an index of 0, rather then 1, the second element has an index of 1, and so on. Here’s an example:

<script>
let studts = ["Ravi", "Abdullah", "David"];
document.write(studts[0]);
document.write(studts[1]);
document.write(studts[2]);
</script>

Changing an Array Element

We can change an array element with the help of it’s index number. Here is an example:

Example

<script>
let studts = ["Ravi", "Abdullah", "David"];
// Here we will change the first element of an array that is Ravi
studts[0] = "Ramesh";
document.write(studts[0]);
</script>

Access the Full Array

we can access full array in JavaScript by referring to the array name. Here is an example:

Example

<script>
let studts = ["Ravi", "Abdullah", "David"];
// Access the full array
document.write(studts);
</script>

Length Property of an Array

The length property returns the number of elements present in an array. Here is an example:

Example

<script>
let studts = ["Ravi", "Abdullah", "David"];
// length of an array
document.write(studts.length);
</script>

Accessing the Last Element of an Array

If our array contains 3, 5 or 15 elements, it’s easy for us to access the last element of an array. But what if an array contains thousands of elements, and our task is to access the last element of an array. If you thinking to count the index numbers, then it would be very difficult for you to count thousands of elements.

Here we use the length property to access the last element of an array. Here is an example:

Example

<script>
let studts = ["Ravi", "Abdullah", "David", "Kevin", "Liza", "Zoha"];
// Access last element of an array:
document.write(studts[studts.length -1]);
</script>

Reverse an Array

In JavaScript, we can also reverse the order of elements in an array using the reverse() method. Here is an example:

Example

<script>
let studts = ["Ravi", "Abdullah", "David", "Kevin", "Liza", "Zoha"];
// Reverse an array
studts.reverse();
document.write(studts);
</script>

Share This Post!

JavaScript Arrays

One thought on “JavaScript Arrays

Leave a Reply

Your email address will not be published. Required fields are marked *