An array in JavaScript is a list-like, ordered collection of values. Each value (called an "element") is identified by a numeric index. Arrays can grow or shrink dynamically, and you can store any data type (numbers, strings, objects, functions, etc) in an array—even mixed types!
let fruits = ["apple", "banana", "cherry"];
let arr = [1, 2, 3];
let arr2 = new Array(1, 2, 3);
let empty = [];
new Array(3) creates an empty array of
length 3, not [3].
Access array elements by index, starting from 0. Negative indexing is
available via at() (see topic 26).
let colors = ["red", "green", "blue"];
console.log(colors[0]); // first item
console.log(colors[2]); // third item
undefined. Use
arr.length for bounds checking.
push() adds one or more elements to the end. unshift() adds to the start.
let arr = [1,2];
arr.push(3); // [1,2,3]
arr.unshift(0); // [0,1,2,3]
pop() removes the last element, shift() removes the first.
let arr = [0,1,2,3];
arr.pop(); // [0,1,2]
arr.shift(); // [1,2]
slice() returns a shallow copy. Also use
[...arr] for a quick clone.
let arr = [1,2,3];
let copy = arr.slice();
let copy2 = [...arr];
Use Array.isArray() to check if something is really an
array.
Array.isArray([1,2,3]); // true
typeof for
arrays!
Assign array values to variables in one line.
let [a, b, c] = [1, 2, 3];
Provide a fallback value if the element is undefined.
let [x, y = 10] = [5];
Use extra commas to skip values during destructuring.
let [first, , third] = [1, 2, 3];
Arrays can contain other arrays, allowing you to create 2D, 3D, or more complex structures.
let matrix = [[1,2],[3,4]];
let [[a, b], [c, d]] = [[1,2],[3,4]];
// Rest
let [first, ...rest] = [1,2,3,4];
// Spread
let arr1 = [1,2];
let arr2 = [...arr1,3,4];
Swap two variables with no temp variable!
let a = 1, b = 2;
[a, b] = [b, a];
let arr1 = [1,2];
let arr2 = [3,4];
let merged = [...arr1, ...arr2];
.length is the total number of elements. It’s mutable:
setting arr.length = n can truncate/expand the array.
let arr = [1,2,3];
arr.length;
arr.length = 0 clears the array instantly!
Combines arrays or values into a new array. Does not modify the originals.
let arr1 = [1,2];
let arr2 = [3,4];
let result = arr1.concat(arr2);
Joins all elements into a string, separated by your chosen character.
let arr = [1,2,3];
arr.join("-");
join("") combines all elements without any
separator.
Fills an array (or part of it) with a static value.
let arr = [1,2,3];
arr.fill(0);
Array(5).fill(1) →
[1,1,1,1,1]
Checks if the array contains a given value (strict comparison).
[1,2,3].includes(2);
Returns the first index of a value, or -1 if not found.
[1,2,3,2].indexOf(2);
Returns the last index of a value, or -1 if not found.
[1,2,3,2].lastIndexOf(2);
Reverses the array in place.
let arr = [1,2,3];
arr.reverse();
toReversed() returns a reversed copy (see topic 31).
Sorts elements in place. By default, sorts as strings (alphabetically).
let arr = [3,1,10,2];
arr.sort(); // ["1","10","2","3"]
arr.sort((a, b) => b-a); // [10,3,2,1]
Add, remove, or replace elements at a specific index.
let arr = [1,2,3,4];
arr.splice(1,2,"x","y");
splice(start, deleteCount, ...items). Always returns the
removed elements.
Accesses array elements using positive or negative indices.
let arr = [1,2,3];
arr.at(-1); // last element
Copies part of the array to another location, overwriting existing elements.
let arr = [1,2,3,4];
arr.copyWithin(1,2);
Flattens nested arrays to the chosen depth (default is 1).
[1,[2,[3]]].flat(2);
Arrays are the foundation for lists, tables, queues, stacks, and more.
let users = [
{name: "A", age: 20},
{name: "B", age: 25}
];
| Immutable Methods | Mutable Methods |
|---|---|
| slice, concat, map, filter, toReversed, toSorted, toSpliced, with, flatMap | push, pop, shift, unshift, splice, sort, reverse, fill, copyWithin |
let arr = [1,2,3];
let rev = arr.toReversed();
let arr = [3,2,1];
let sorted = arr.toSorted();
toSorted((a,b)=>b-a) for descending
order.
let arr = [1,2,3];
let newArr = arr.toSpliced(1,1,9);
Returns a copy of the array with a value changed at the specified index.
let arr = [1,2,3];
let newArr = arr.with(1, 99);
length property (e.g. arguments object in
functions, NodeLists, strings).
They are not real arrays, but you can convert them to arrays with
Array.from().
Converts array-like or iterable objects to real arrays.
Array.from("hello");
Converts async iterables to arrays asynchronously (ES2023+).
async function* gen() { yield 1; yield 2; }
let arr = await Array.fromAsync(gen());
await in an async function context.
Creates a new array from its arguments (especially useful to avoid
new Array() confusion).
Array.of(1,2,3);
Returns a new array of elements that pass the test function.
[1,2,3,4].filter(n => n > 2);
Returns a new array with the results of calling a function for every element.
[1,2,3].map(n => n * 2);
"Reduces" array to a single value by accumulating results.
[1,2,3].reduce((acc, cur) => acc + cur, 0);
Same as reduce() but processes the array from
right-to-left.
[1,2,3].reduceRight((acc, cur) => acc + cur, 0);
Checks if at least one element passes the test.
[1,2,3].some(n => n > 2);
Checks if every element passes the test.
[1,2,3].every(n => n > 0);
Returns the first element that passes the test, or
undefined if none found.
[1,2,3].find(n => n > 1);
[1,2,3].findIndex(n => n > 1); // 1
[1,2,3,2].findLastIndex(n => n === 2); // 3
[1,2,3,2].findLast(n => n === 2); // 2
let result = [1,2,3,4]
.filter(n => n % 2 === 0)
.map(n => n * 10);
Executes a function for each array element (does not return a value).
[1,2,3].forEach(n => console.log(n));
forEach() is for side effects, not for transformation.
Returns an iterator of [index, value] pairs.
for (let [i, v] of [10,20].entries()) {
console.log(i, v);
}
Returns an iterator of array values. Useful in
for...of loops.
for (let v of [1,2,3].values()) {
console.log(v);
}
Maps each element, then flattens the result by one level.
[1,2,3].flatMap(n => [n, n*2]);
Rafi Ullah 2025 - All rights resereved