Arrays

Arrays are lists of ordered, stored data. They can hold items that are of any data type.

Syntax

Arrays can be created by using square brackets, with individual elements separated by commas.

// An array containing numbers
const numberArray = [0, 1, 2, 3];

// An array containing different data types
const mixedArray = [1, 'chicken', false];

Another way to creating a new instance of the Array class and passing the elements as a comma-separated list of arguments:

const classArray = new Array(0, 1, 2, 3);

Creating an Array

The most straightforward way to create an array is using an array literal as in the above example.

const fruit = ['Apple', 'Orange', 'Banana'];

Whitespace is ignored and declarations can span multiple lines.

Arrays can also be created with the Array class by using the new keyword and passing in the elements as arguments:

const fruit = new Array('Apple', 'Orange', 'Banana');

Though, because the effect is exactly the same, it is preferable to use the literal method for simplicity and execution speed.

Accessing the Elements of an Array

Array elements are ordered by index values, starting at 0:

Index 0 has the first element.
Index 1 has the second element.
Index 2 has the third element.
Index n-1 has the nth element.

Individual elements in the array can be accessed using the array name and the element’s index surrounded by square brackets.

This code accesses the value of the first element in the fruit array:

const fruit = ['Apple', 'Orange', 'Banana'];

console.log(fruit[0]);
// Output: Apple

Array elements can be changed by accessing the element and assigning a new value to it.

const fruit = ['Apple', 'Orange', 'Banana'];

fruit[1] = 'Mango';

console.log(fruit[1]);
// Output: Mango

Accessing an array using an unused index will return undefined. However, a new value can still be assigned to an unused index of an array. When doing so, any gaps in the assigned indices will remain undefined.

const fruit = ['Apple', 'Orange', 'Banana'];

fruit[4] = 'Mango'; // a valid assignment

console.log(fruit[3]);
// Output: undefined

Nested Arrays

Any object can be an element of an array, including other arrays. Arrays with one or more arrays as elements are referred to as “nested arrays”. Similar to accessing the elements of a regular array, accessing elements within nested arrays requires the additional indices for referencing inner array elements.

// Create a nested array
const food = [
  ['Apple', 'Orange', 'Banana'],
  ['Strawberry', 'Blueberry', 'Raspberry'],
  ['Potato', 'Carrot', 'Broccoli'],
];

// Retrieve the food string at index 2 of the array at index 1
console.log(food[1][2]);
// Output: Raspberry

// Retrieve the food string at index 1 of the array at index 0
console.log(food[0][1]);
// Output: Orange

The same process applies to nested arrays that themselves contain nested arrays. The more “nested” the array, the more indices, or bracket pairs [ ], are required for accessing their elements.


Code
Output
Loading...

Arrays

.concat(): Merges, or concatenates, two or more arrays.
.copyWithin(): Returns a mutated array with part of it copied to another location in the same array, and its length unchanged.
.filter(): Creates a new array with all elements that pass the test from the provided function.
.find(): Returns the first element in the array that satisfies the given function.
.findIndex(): Returns the first index that passes the callback function's test. Returns -1 if no element passes the test.
.forEach(): Loops over the array, passing each item in the array into the callback function provided.
.includes(): Returns true if a given value is included in an array.
.indexOf(): Returns the first index at which an element can be found. Returns -1 if element is not found.
.isArray(): Returns true for arrays, otherwise false.
.join(): Elements of an array are converted to strings and concatenated together, returning the resulting string.
.lastIndexOf(): Returns the last index at which an element can be found. Returns -1 if element is not found.
.length: Returns the specific number of elements in the array.
.map(): Creates a new array with the results of calling a function for every element in array.
.pop(): Removes the last element of an array, decrements the array length, and returns the value that it removed.
.push(): Adds one or more elements to the end of the array and returns the new length.
.reduce(): Combines each element of an array, using a specified reducer function, and returns a single value.
.reverse(): Reverses the order of the elements of an array in place and returns the reversed array.
.shift(): Removes and returns the first element of the array. All subsequent elements will shift down one place.
.slice(): Returns a shallow copy of part of array, while original array is not modified.
.sort(): Returns an array with its items sorted in place.
.splice(): Modifies an array by inserting, deleting, and/or replacing array elements then returns an array of deleted elements.
.toString(): Returns a string with each of the array values, separated by commas. Does not mutate the original array.
.unshift(): Adds one or more elements to beginning of array and returns new length.
.valueOf(): Returns the value of all the elements of the original array.