Javascript Array is used to store the multiple values in a single variable.
There are 2 ways to create the array in JavaScript
- By array literal ([ ])
- By array constructor (using new keyword)
var languages = ["PHP", "Java", "C"];
Create Array by array literal
It is easy way to create the Array.
Syntax :
var array_name = [value1, value2, ...];
Example :
<html>
<head>
<title>Developer Helps | Javascript Array</title>
</head>
<body>
<h2>JavaScript Array Using Literal</h2>
<p id="lang"></p>
<script>
var languages = ["PHP", "Java", "C"];
document.getElementById("lang").innerHTML = languages;
</script>
</body>
</html>
Output :
JavaScript Array Using Literal
PHP,Java,C
Array using new keyword
It creates the Array using array constructor.
Syntax :
var array_name = new Array(value1, value2, ...);
Example :
<html>
<head>
<title>Developer Helps | Javascript Array</title>
</head>
<body>
<h2>JavaScript Array Using New Keyword</h2>
<p id="lang"></p>
<script>
var languages = new Array("PHP", "Java", "C");
document.getElementById("lang").innerHTML = languages;
</script>
</body>
</html>
Output :
JavaScript Array Using New Keyword
PHP,Java,C
Fetch the Elements of an Array
You can fetch the element of array by its index number.
Example :
If you want to fetch the first element of array.
<html>
<head>
<title>Developer Helps | Javascript Array</title>
</head>
<body>
<h2>Fetch Element of Array</h2>
<p id="lang"></p>
<script>
var languages = ["PHP", "Java", "C"];
document.getElementById("lang").innerHTML = languages[0];
</script>
</body>
</html>
Output :
Fetch Element of Array
PHP
Javascript Array Uses as Object
Array is special type of object.
Example :
<html>
<head>
<title>Developer Helps | Javascript Array</title>
</head>
<body>
<h2>Javascript Array as Object </h2>
<p id="lang"></p>
<script>
var programming = {language:"PHP", framework:"Laravel"};
document.getElementById("lang").innerHTML = programming["language"];
</script>
</body>
</html>
Output :
Javascript Array as Object
PHP
Javascript Array Length
The length property return the number of elements in an array.
Example :
<html>
<head>
<title>Developer Helps | Javascript Array Length</title>
</head>
<body>
<h2>Fetch Length of Array</h2>
<p id="lang"></p>
<script>
var languages = ["PHP", "Java", "C"];
document.getElementById("lang").innerHTML = languages.length;
</script>
</body>
</html>
Output :
Fetch Length of Array
3
Javascript Array Push( ) Method
Push method adds new element to the end of array. This method update the length of array too.
Example :
<html>
<head>
<title>Developer Helps | Javascript Array Push</title>
</head>
<body>
<h2>Add the Element in Javascript Array</h2>
<p id="lang"></p>
<script>
var languages = ["PHP", "Java", "C"];
languages.push("Wordpress","Laravel","Javascript");
document.getElementById("lang").innerHTML = languages;
</script>
</body>
</html>
Output :
Add the Element in Javascript Array
PHP,Java,C,Wordpress,Laravel,Javascript
Thanks for the reading post. I hope you like and understand the post. If you have any doubt regarding this post please comment below.