/

HTML / CSS / JavaScript Tutorial

JavaScript Tutorial: Array Variables

[this page | pdf | back links]

JavaScript array variables contain multiple (indexed) values in a single variable. Array indices are zero-based, i.e. the first element of the array has as its index 0, the second 1 etc. They are instantiated by statements such as:

 

var a = ["France", "Germany"];

var b = [1, 2, 5, 4];

 

Copying an array is a little more difficult than it looks. This is because each element of an array can itself be an array or an object. For example, the following two assignments don’t create two separate arrays.

              

var a = ["France", "Germany"];

var b = a;

 

Instead, if we now set b[1] equal to "Denmark", then a[1] will also become equal to "Denmark". For the sort of array involved here (e.g. an array of literals then the following will create two separate arrays:

 

var a = ["France", "Germany"];

var b = a.slice();

 

The method slice() (with no parameters passed to it) can typically be replaced by concat() (also with no parameters passed to it). However, if a has some elements that are themselves arrays then the corresponding elements of b would still only point to the same physical arrays as elements of a, and changing these would also change the sub-elements in a. Also the use of slice() and concat() may not work as intended if a is not an array or is undefined. An alternative that is more robust to unusual forms of arrays involves recursively copying elements, and can be implemented for all types of arrays by adding a method that the array possesses as follows:

 

object.prototype.clone = function() {

  var a = (this instanceof array) ? [] : {};

  for (i in this) {

    if (i == "clone") continue;

    if (this[i] && typeof this[i] == "object") {

      a[i] = this[i].clone();

    }

    else

      a[i] = this[i];

  } return a;

};

 

Arrays support the following properties and methods:

 

Properties:

 

Property

Description

More

constructor

Returns object’s constructor function

Here

length

Returns length of array

Here

prototype

Allows author to add properties and methods to an object

Here

 

Methods:

 

Method

Description

More

concat()

Joins arrays and returns a copy of the joined array

Here

copyWithin()

Copies elements to and from specified positions

Here

every()

Returns true if every element passes a specified test, otherwise returns false

Here

fill()

Sets elements of an array to a specified value

Here

filter()

Creates a new array consisting only of elements that pass a specified test

Here

find()

Returns value of first element that passes a specified test

Here

findIndex()

Returns index of first element that passes a specified test

Here

forEach()

Calls a function for each element

Here

indexOf()

Returns index of first element found when an array is searched

Here

isArray()

Returns true if object is an array, otherwise false

Here

join()

Joins all elements of an array into a string

Here

lastIndexOf()

Returns index of first element found when an array is searched, backwards from the end

Here

map()

Creates a new array consisting of elements which are the result of calling a function on each element in turn

Here

pop()

Removes last element of array and returns that element

Here

push()

Adds new elements to end of array and returns new length

Here

reduce()

Reduces the values of an array to a single value (evaluating from left to right, i.e. from lowest to highest index)

Here

reduceRight()

Reduces the values of an array to a single value (evaluating from right to left, i.e. from highest to lowest index)

Here

reverse()

Reverses order of array

Here

shift()

Removes first element and returns that element

Here

slice()

Selects a part of an array and returns that part

Here

some()

Returns true if at least one element passes a specified test, otherwise returns false

Here

sort()

Sorts elements of the array

Here

splice()

Adds / removes elements

Here

toString()

Converts array to a string

Here

unshift()

Adds new elements to beginning of the array

Here

valueOf()

Returns the primitive value of the object

Here

 


NAVIGATION LINKS
Contents | Prev | Next | JavaScript Arrays


Desktop view | Switch to Mobile