Welcome to the JavaScript tutorial, we already covered JavaScript number, JavaScript Boolean and JavaScript Strings. Today we will talk about JavaScript arrays object. The JavaScript arrays object will store a multiple set of values in a single variable name. These values in arrays will have an associated index number.
Note: Array index will start from zero. It means the position of the first element in the array will be 0, and then 1 and the numbering will continue till last element.
JavaScript Arrays Object- Syntax
We can create array object by two ways, or rather three ways. Don’t worry, we will check it out, to understand its ease of use.
First way:
This way is very simple, here we will create JavaScript arrays by just putting the values or elements.
var sharplesson = [ “SEO’, “ Web Hosting”, “JavaScript”, “Html”, “CSS”, “Blogging” ]
At 0 you will get SEO, at 1 you will get web hosting and so on. We have just created an array that will have the elements, like SEO, Web hosting and etc.
Second way:
Now we will create the JavaScript arrays object using the constructor.
var sharplesson = new Array ( “SEO”, “ Web hosting”, “ JavaScript”, “Html”, “CSS”, “ Blogging”)
We have used the same example, but using the constructor here. We have just mentioned the values here. In case you just want to mention the array length and not the value, then can go for a third way.
Third way:
Here, we will create the JavaScript arrays object using the same constructor. But we will set the initial length of the array here.
var sharplesson = new Array (6)
Now this will insure that the total number of elements that will go inside is 6 only. Now you will assign data to each of the elements in the array.
sharplesson [0] = “SEO”;
sharplesson [1] = “Web Hosting”;
sharplesson [2] = “JavaScript”;
sharplesson [3] = “Html”;
sharplesson [4] = “CSS”;
sharplesson [5] = “Blogging”;
Now we don’t think you will be having any doubt regarding the syntax of JavaScript arrays object.
JavaScript Arrays object – Properties
Now we will check the JavaScript arrays object properties that you can use:
- Constructor () – We already used in the above example. It will return the function which made the object.
- length () – It will let you know the number of elements in an array.
- prototype() – If you want to add methods or any properties to the array object, then you can use it.
JavaScript Arrays object – Methods
Now we will check the JavaScript arrays object methods that you can use:
- isArray() – You can use this method to check for an array, if it is, then it will return true and if not, then it will return false.
- concat () – It means joining, you can use it, if you want to join two arrays. It will join it and then return the final result.
- join () – If you want to join the elements of the array itself, then you can use ‘join’ method.
- reverse () – It will reverse the order of the normal result. The first element will go to last and last will come in first place.
- slice () – If you want to show only selected elements of the array, then you can use slice () there.
- toString () – If you want results in a string, then you can convert an array into a string using this method. ( The funny part is you can test join () as well, most of the time it will give the same result).
- sort () – It will sort the result in ascending, descending, numeric or alphabetic order.
- splice () – If in case you forgot to add something to add to array, then you can use the splice method to do so. Same will apply for the removal of the element as well.
- pop () – It will help you do delete the last element of the array and will show the rest of the results.
- push () – It will work opposite to pop method. It will add elements at the last of the array and will show the updated result.
Note: We have just mentioned the JavaScript arrays method that is most common in use. In case you want to check the full list, then refer our JavaScript reference.
JavaScript Arrays Object – Example
Now we will see how to create the JavaScript arrays object, and will see the result as well. We have created the object using the third way of syntax and assigned the same values as we used for the above example.
<html>
<head> </head>
<body>
<script type="text/javascript">
var sharplesson = new Array(6)
sharplesson [0] = "SEO";
sharplesson [1] = "Web Hosting";
sharplesson [2] = "JavaScript";
sharplesson [3] = "Html";
sharplesson [4] = "CSS";
sharplesson [5] = "Blogging";
for (i=0; i<6; i++)
{
document.write(sharplesson[i] + "<br>")
}
</script>
</body>
</html>
The output will be:
SEO
Web Hosting
JavaScript
Html
CSS
Blogging
We have just used the JavaScript for loop to execute the result until it fails the condition. Once the JavaScript interpreter will find that the condition is false, it will not execute further.
Conclusion
We have just covered JavaScript arrays object, its syntax, properties and methods. We have used a very simple example to let you understand the use of syntax and methods as well. At last we saw the use of the third kind of syntax uses with ease. The only thing we will recommend to our readers is just practice it. Because you will forget the beauty of JavaScript very easily.