JavaScript Array Object

JavaScript Array

As you all know, normally a variable can hold only one piece of data at a time. But Arrays are special because it can hold more than one value at a time, and you can access these values individually.

If you already know the number of items that would store in an array, you can pass the number to the constructor of an Array Object

The above array declaration creating an Array using the Constructor, that holds 10 undefined elements. Similarly, you can directly initialize the Array elements when declaring an Array Object.

Arrays are a group of data items that you can treat as a single unit. It is helpful when you want to store a group of values in the same variable instead of using separate variables for each value. Like other programming languages, JavaScript array indexes start from 0 (zero) and continue as 1,2,3 etc..

Displaying Javascript Array elements

You can display Array elements in several ways. The following methods will show all elements from an Array.

Accessing individual Values from Javascript Array

The above statement will display "Monday", because Javascript Array index starts from 0, so weekArray[1] is Monday. If you try to access an element that does not exist, it will return undefined instead of throwing an error.

The above statement will return undefined, because weekArray[12] does not exists.

Accessing Array elements using for loop

Assigning values to Javascript Array

The above statement add a new value to the Javascript Array.

Array element types

JavaScript Data Types

Normally programming languages hold one type of value in an array. That is, if you want to hold string types, numeric types etc. you have to declare different types of array for storing string and numeric values. But in Javascript you can hold any type of data in each slot. That means you can store any type of data together in a Javascript Array such as string, numeric, Boolean, object etc.

In the above declaration genericArray stores String, Numeric, Boolean and Object.

Javascript Array Length

The Length property of Javascript Array return the number of elements contains in an Array. Javascript Array index starts from 0 so the length of an array is equal to the last index + 1.

The above statement will return 7, that means the weekArray contains seven elements.

If you specified the length while creating the array, this will return as length property's value.

Arrays Undefined Values

Arrays are automatically growing and dynamically sized to accommodate any type of data that is added to them. So, when you add or remove elements from an array, the length of the array will change as needed. When you declare an Array with constructor, each slot will be set to "undefined".

Array.push()

The array.push() in Javascript add new elements to the end of an Array and changes the length of the array.

The above code will return Red, Green, Blue , Yellow, that is Yellow added at the end of the Array

Array.contains()

The Array.Contains() method checking whether or not an item is contained within your array.

Array.sort

Javascript Array Sort

Javascript Array.sort() method sort the elements in an Array either Alphabetic or Numeric, also you can sort ascending or descending. The default sort order is alphabetic and ascending.

Alphabetical Order

The array order will be...Monday, Sunday, Tuesday.

The array order will be...Tuesday, Sunday, Monday

Numerical Order

The array order will be..30, 40, 50, 80

The array order will be..80, 50, 40, 30

Array.splice()

The splice() method in Javascript add new elements to the Array and removing old elements from Array.

colors.splice(2,0,"Yellow","Orange") means that add new elements at the array index 2 and removed 0 elements.

The array order will be ...Red, Blue, Yellow, Orange, Green

Array.slice()

The slice() method in Javascript retrieve the elements starting at the first argument, and ends at second argument-1.

The selectedColors are...Blue,Green.

colors.slice(1, 3) select 1 to 3-1 elements from colors.

Array.join()

The join() method in Javascript will be separated by a specified separator with given argument.

The result will be Red#Blue#Green

The result will be RedBlueGreen