Comprehensive Guide to JavaScript Arrays and Built-in Methods

Here is the complete list of JavaScript array methods categorized by their primary functions.

Array Creation and Identification

This section covers the foundational methods used to create new arrays or identify array types in JavaScript.

Array() Constructor

The Array() constructor creates a new array. It can be invoked with or without the new keyword — both produce the same result.

• If called with a single numeric argument, it creates an array with that length (empty slots).

• With multiple arguments, it creates an array containing those values.

Syntax:

new Array();
new Array(element1, element2, ..., elementN);
new Array(arrayLength);

Examples:

// Empty array
const empty = new Array(); // []

// Array with length 3 (empty slots)
const fixedSize = new Array(3); // [ <3 empty items> ]

// Array with predefined elements
const fruits = new Array("Apple", "Banana"); // ["Apple", "Banana"]

// Without using 'new'
const cities = Array("Paris", "Berlin"); // Works the same way

If you pass one number (e.g., new Array(2)), it sets the array length, but doesn't fill it with undefined. Those are empty slots, as noted by MDN.

Array.from()

Array.from() creates a new shallow-copied Array instance from an iterable (like a string, Set, or Map) or an array-like object (like arguments). It also takes an optional mapping function to modify elements while creating the array.

Syntax:

Array.from(arrayLike, mapFn?, thisArg?);

Examples:

// From string
Array.from("hello");
// ["h", "e", "l", "l", "o"]

// From Set
const letters = new Set(["a", "b", "c"]);
Array.from(letters);
// ["a", "b", "c"]

// With mapping function
Array.from([1, 2, 3], x => x * 2);
// [2, 4, 6]

// Generate a range
const range = Array.from({ length: 5 }, (_, i) => i + 1);
// [1, 2, 3, 4, 5]

This is ideal when transforming iterables into arrays with a single step.

Array.of()

Creates a new Array instance with the provided elements, avoiding the numeric ambiguity of the Array() constructor.

Syntax:

Array.of(element1, element2, ..., elementN);

Examples:

Array.of(7);       // [7]
Array(7);          // Empty array with length 7
Array.of(1, 2, 3); // [1, 2, 3]
Array.of();        // []

Why use Array.of()?
⁠When you intend to explicitly create arrays containing numeric values and not arrays of empty slots, this method removes confusion between creating an array with a length and one with actual values

Array.isArray()

Determines if a given value is an array.
Useful when checking data types before performing array operations.

Syntax:

Array.isArray(value);

Examples:

Array.isArray([1, 2, 3]); // true
Array.isArray({});        // false
Array.isArray("hello");   // false
Array.isArray(new Array()); // true

Array.isArray is especially handy when working with APIs or dynamic data, ensuring you can differentiate between arrays and objects.

length

Every array has a length property that reflects the count of elements, including empty slots.

Examples:

const colors = ["red", "green", "blue"];
console.log(colors.length); // 3

colors.length = 2; // Truncates the array
console.log(colors); // ["red", "green"]

colors.length = 5; // Expands with empty slots
console.log(colors); // ["red", "green", <3 empty items>]

The length property is writable — reducing it truncates the array, while increasing it creates sparse arrays with empty slots

constructor

Returns the constructor function that created the array instance — usually Array() itself.

Syntax:

array.constructor;

Example:

const numbers = [1, 2, 3];
console.log(numbers.constructor); // function Array() { [native code] }

This is useful for verifying if an object is constructed by Array(), though Array.isArray() is a clearer check for array detection

Adding and Removing Elements

Here’s a breakdown of the most important array methods for adding, removing, and rearranging elements, along with clear examples for each.

push()

Adds one or more elements to the end of an array. Returns the new array length.

let fruits = ["Apple", "Banana"];
let newLength = fruits.push("Kiwi", "Orange");
// fruits: ["Apple", "Banana", "Kiwi", "Orange"]
// newLength: 4

Use when you want to expand an array at the end.

pop()

Removes the last element from the array and returns that element.

let numbers = [1, 2, 3];
let last = numbers.pop();
// numbers: [1, 2]
// last: 3

Handy for removing the last item.

shift()

Removes the first element from the array and returns it. All remaining elements shift one position lower.

let queue = [1, 2, 3];
let first = queue.shift();
// queue: [2, 3]
// first: 1

unshift()

Adds one or more elements to the start of the array. Returns the new length.

let animals = ["Cat", "Dog"];
let len = animals.unshift("Rabbit", "Pig");
// animals: ["Rabbit", "Pig", "Cat", "Dog"]
// len: 4

splice()

Can add, remove, or replace elements at any position in the array.

Syntax:

array.splice(start, deleteCount, item1, item2, ...)

• start: the index to change

• deleteCount: how many elements to remove

• item1, item2, ...: new items to add

Examples:

let colors = ["Red", "Yellow", "Blue"];
colors.splice(1, 1); // Removes "Yellow"
// colors: ["Red", "Blue"]

colors.splice(1, 0, "Green"); // Inserts "Green" at index 1
// colors: ["Red", "Green", "Blue"]

colors.splice(1, 1, "Orange"); // Replaces "Green" with "Orange"
// colors: ["Red", "Orange", "Blue"]

toSpliced()

Returns a new array with specified elements removed or replaced, leaving the original untouched (non-mutating version of splice).

let arr = ["a", "b", "c", "d"];
let newArr = arr.toSpliced(1, 2, "x", "y");
// newArr: ["a", "x", "y", "d"]
// arr: ["a", "b", "c", "d"]

slice()

Returns a new array containing a shallow copy of a portion of the original array. Does not modify the original array.

Syntax:

array.slice(start, end)

• start: index to begin (inclusive)

• end: index to stop (exclusive)

Example:

let nums = [0, 1, 2, 3, 4];
let part = nums.slice(1, 4); // [1, 2, 3]

Extracts subarrays for further work.

concat()

Combines two or more arrays or values, returning a new array. Original arrays aren’t changed.

let arr1 = [1, 2];
let arr2 = [3, 4];
let combined = arr1.concat(arr2, 5);
// combined: [1, 2, 3, 4, 5]

copyWithin()

Copies a section of the array in place to another position within the same array.

let nums = [1, 2, 3, 4, 5];
nums.copyWithin(0, 3, 5); // Copy indexes 3–4 into start
// nums: [4, 5, 3, 4, 5]

fill()

Replaces elements in the array with a static value. Optionally use start and end to target a range.

let arr = [1, 2, 3, 4];
arr.fill(0, 2, 4); // Fills from index 2 up to (not including) 4 with 0
// arr: [1, 2, 0, 0]

with()

Returns a new array with the element at the given index replaced by a provided value, original stays unchanged (non-mutating).

let letters = ["a", "b", "c", "d"];
let updated = letters.with(2, "z");
// updated: ["a", "b", "z", "d"]
// letters: ["a", "b", "c", "d"]

Iteration and Searching

Sorting and Reversing

Reduction and Transformation

String Conversion

Copying and Cloning