How to Create Arrays in JavaScript?

Following example shows you how to create Arrays in JavaScript.

An array is a special variable type, which can hold more than one value in it at a time. Arrays are declared using the Array() constructor. An array can hold data types such as Boolean values, String values, floating point numbers or Objects in it. Values in an array called 'elements'. Every array element has an index. Normally first array element has the zero index. We can get the total array elements using length property of the array. Arrays can be single dimension or multi-dimensional. If you have long list of values such as a country list; how do you declare that values in your program? You can define one or two variable to store 1 or two countries. But can you declare variable of all items in that list? It is not a possible task. The easiest way is the define an Array to store that data.

Demo- Create arrays in JavaScript.

How to Declare Arrays in JavaScript?

Declare an empty array in JavaScript. var emptyAarray=new Array();

Declares an array with 7 elements. var days=new Array("Sunday","Monday","Tuesday", "Wednesday","Thursday","Friday","Saturday");

Declare an empty array with which can hold five elements. var letters=new Array(5); five elements in it. letters[0]="A"; letters[1]="B"; Likewise you can assign values to Array elements.

Accessing array elements. You can access array elements using for loop. Also you can assign values to array elements looping through for loop. <scrip type="text/javascript"t> var marks=new Array(58,45,79,86,93,60,55); for(var i=0;i<marks.length;i++){ document.write(marks[i]+"-"); } </script> out put 58-45-79-86-93-60-55

How to store objects in an array? You can store Objects in a array as same as storing other values. <script type="text/javascript" language="javascript"> var box1=Object(); box1.width=34; box1.height=45; var box2=Object(); box2.width=200; box2.height=100; var boxes=new Array(box,box2); alert(boxes.length);//output = 2 alert(boxes[0].width);// out put = 34 </script>

How to create multi dimensional arrays in JavaScript? <script type="text/javascript" language="javascript"> var multiplicationTable=[[2,4,6], [3,6,9], [4,8,12], [5,10,15], [6,12,18]]; alert(multiplicationTable[3][2]);//out put=15 alert(multiplicationTable[0][0]);//out put=2 </script>

Array Methods

concat() method Concatenates elements from one array to another array. <script type="text/javascript" language="javascript"> var array1=new Array("Red","Green","Blue"); var array2=new Array("Pink","Black","Orange","Green"); var array3=array1.concat(array2); document.write(array3); </script> Out put: Red,Green,Blue,Pink,Black,Orange,Green

join() converts the array to a string and allows you to specify how the elements are separated in the resulting string. <script type="text/javascript" language="javascript"> var array1=new Array("Red","Green","Blue","Pink","Black"); document.write(array1.join("-"));//Out put: Red-Green-Blue-Pink-Black document.write(array1.join("/")); //Out put: Red/Green/Blue/Pink/Black </script>

pop() method Removes and returns the last element of an array. <script type="text/javascript" language="javascript"> var array1=new Array("Red","Green","Blue","Pink","Black"); document.writeln(array1.pop());//Out put: Black document.writeln("<br/>"); document.writeln(array1); //Out put Red,Green,Blue,Pink </script>

push() method adds elements to the end of an array You can add any number of elements to the end of the array using push() method. <script type="text/javascript" language="javascript"> var array1=new Array("Red","Green","Blue","Pink"); document.writeln(array1);//Out put: Red,Green,Blue,Pink document.writeln("<br/>"); array1.push("Black"); document.writeln(array1); //Out put: Red,Green,Blue,Pink,Black </script>

reverse() method Reverses the order of the elements in an array. <script type="text/javascript" language="javascript"> var array1=new Array("1","2","3","4","5"); document.writeln(array1);//Out put: 1,2,3,4,5 document.writeln("<br/>"); array1.reverse(); document.writeln(array1); //Out put: 5,4,3,2,1 </script>

shift() Removes and returns the first element of an array. <script type="text/javascript" language="javascript"> var array1=new Array("Red","Blue","Green","Orange","White"); document.writeln(array1);//Out put: Red,Blue,Green,Orange,White document.writeln("<br/>"); document.writeln(array1.shift());// Out put: Red document.writeln("<br/>"); document.writeln(array1); //Out put: Blue,Green,Orange,White </script>

slice() method copies elements of one array into a new array. The slice() method takes two arguments. the first number is the starting position of elements that will be copied, and the second argument is the last position in the array. <script type="text/javascript" language="javascript"> var array1=new Array("Red","Blue","Green","Orange","White","Black"); document.writeln(array1);//Out put: Red,Blue,Green,Orange,White,Black document.writeln("<br/>"); var array2=array1.slice(1,3); document.writeln("<br/>"); document.writeln(array2);//Out put: Blue,Green var array3=array1.slice(2,5); document.writeln("<br/>"); document.writeln(array3);//Out put: Green,Orange,White </script>

sort() method sorts an array alphabetically. <script type="text/javascript" language="javascript"> var array1=new Array("Red","Blue","Green","Orange","White","Black"); document.writeln(array1);//Out put: Red,Blue,Green,Orange,White,Black document.writeln("<br/>"); var array2=array1.sort(); document.writeln(array2);//Black,Blue,Green,Orange,Red,White </script>

toString() method returns a string representation of the array. <script type="text/javascript" language="javascript"> var array1=new Array("Red","Blue","Green","Orange","White","Black","233","345"); document.writeln(array1);//Out put: Red,Blue,Green,Orange,White,Black,233,345 document.writeln("<br/>"); var str1=array1.toString(); document.writeln(str1);//Out put: Red,Blue,Green,Orange,White,Black,233,345 alert(typeof(str1));//alerts 'string' </script>

unshift() method dds elements to the beginning of an array. <script type="text/javascript" language="javascript"> var array1=new Array("Red","Blue","Green","Orange"); document.writeln(array1);//Out put: Red,Blue,Green,Orange document.writeln("<br/>"); array1.unshift("White","Black"); document.writeln(array1);//Out put: White,Black,Red,Blue,Green,Orange </script>

splice() method removes a specified number of elements from specified starting position in an array and allows you to replace that items with new elements. splice() method has two constructors. splice(int starting_point,int items_to_remove) splice(int starting_point,int items_to_remove,replacement_elements) <script type="text/javascript" language="javascript"> var array1=new Array("Red","Blue","Green","Orange","Black","White"); document.writeln(array1);//Out put: Red,Blue,Green,Orange document.writeln("<br/>"); array1.splice(2,2); document.writeln(array1);//Out put: White,Black,Red,Blue,Green,Orange document.writeln("<br/>"); var array2=new Array("One","Two","Three","Four","Seven","Eight","Nine"); document.writeln(array2);//Out put: One,Two,Three,Four,Seven,Eight,Nine array2.splice(4,2,"Five","Seven"); document.writeln("<br/>"); document.writeln(array2);//Out put: One,Two,Three,Four,Five,Seven,Nine </script>

Try It!

»	How to get screen resolution in JavaScript
»	How to limit characters in textarea using JavaScript
»	How to validate decimal number in JavaScript
»	How to validate an email address in JavaScript
»	How to validate date using JavaScript
»	JavaScript String functions
»	How to validate multiple select list box in JavaScript
»	How to generate random numbers in JavaScript
»	How to validate multiple check box in JavaScript
»	How to validate user login in JavaScript
»	How to validate drop down list in JavaScript
»	How to validate radio button group in JavaScript
»	How to create JavaScript alerts
»	How to create popup windows in JavaScript
»	How to count words in a text area using JavaScript

©-Copyright By Duminda Chamara JavaScript Validation