JavaScript Arrays
The JavaScript 'Array' class is a global object that is used in the construction of arrays; which are high-level, list-like objects. When we need an ordered collection, where we have a 1st, a 2nd, a 3rd element and so on, we need arrays. JavaScript arrays are used to store multiple values in a single variable.
Syntax for creating an empty array is:
Either use
js_array = new Array();
or
js_array = [ ];
Eg:
<script>
countries = new Array(); /* defines an empty array first. (You can directly define an array without prior declaration). */
countries = ["India", "USA", "Chile"];
alert(countries[0]); /* output will be an alert box with value as 'India' */
</script>
"array.length" returns the number of elements in an array.
JavaScript Array Methods
concat()
The concat() method returns a new array by merging two or more arrays.
Eg:
<script>
fruit1 = ["Apple","Orange"];
fruit2 = ["Banana"];
fruit3 = ["Mango","Pear","Pineapple"];
document.write(fruit1.concat(fruit2, fruit3));
</script>
Output:
Apple,Orange,Banana,Mango,Pear,Pineapple
join()
The join() method joins all the elements in an array using a separator and returns the array as a string. If separator is not specified, default will be comma (,).
Eg:
<script>
fruit3 = ["Mango","Pear","Pineapple"];
document.write(fruit3.join(" or "));
</script>
Output:
Mango or Pear or Pineapple
pop()
The pop() method is used to remove the last element of an array. Method returns the element removed.
Eg:
<script>
fruit3 = ["Mango","Pear","Pineapple"];
document.write(fruit3.pop()); /* removes the element Pineapple */
</script>
Output:
Pineapple
push()
The push() method is used to add one or more elements to the end of an array. The push() method returns the length of the new array.
Eg:
<script>
fruit3 = ["Mango","Pear","Pineapple"];
document.write(fruit3.push("Apple","Orange")); /* Output will be 5, length of new array*/
document.write("<br>"+fruit3); /* Output will be the resultant array */
</script>
Output:
5
Mango,Pear,Pineapple,Apple,Orange
reverse()
The reverse() method reverses the position of array elements. The first array element becomes the last, and the last array element becomes the first. Note that the reverse() method overwrites the original array.
Eg:
<script>
fruit3 = ["Mango","Pear","Pineapple"];
document.write(fruit3.reverse());
</script>
Output:
Pineapple,Pear,Mango
sort()
The sort() method sorts array elements alphabetically.
Eg:
<script>
fruit3 = ["Mango","Pear","Pineapple"];
document.write(fruit3.sort());
</script>
Output:
Mango,Pear,Pineapple
splice()
The splice() method changes the contents of an array by removing or replacing existing elements or adding new elements to the array. It returns the array containing the removed items.
Eg:
<script>
fruit3 = ["Mango","Pear","Pineapple"];
var ret_arr = fruit3.splice(1, 1, "Apple", "Orange"); /* Removes 'Pear'*/
document.write(ret_arr); /* Output 'Pear' */
document.write("<br>"+fruit3); /* Output resultant array */
</script>
Output:
Pear
Mango,Apple,Orange,Pineapple
find()
The find() method returns the first element in an array that satisfies a test provided by a function. It returns ‘undefined’ if no element satisfies the test.
Syntax:
array.find(function(currentElement, index, array_object),thisvalue);
Eg:
<script>
var mark_list = [28,42,17,45,44,37];
function checkMark(mark)
{
return mark > 40;
}
var got_mark = mark_list.find(checkMark);
document.write("Mark is "+got_mark);
</script>
Output:
Mark is 42
toString()
'toString()' in JavaScript converts an array to a comma separated string.
Eg:
<script>
fruit3 = ["Mango","Pear","Pineapple"];
document.write(fruit3.toString());
</script>
Output:
Mango,Pear,Pineapple