JS Array Reference

📚 JavaScript Array Reference

This is your complete reference guide for all JavaScript array methods and properties. Use this as a quick lookup when working with arrays.


// Array reference example
const arr = [1, 2, 3];
console.log(arr.length); // Property: 3
arr.push(4);             // Method: adds element
console.log(arr);        // [1, 2, 3, 4]

Array Properties

📏

length

Gets or sets array length

const arr = [1, 2, 3];
console.log(arr.length); // 3
arr.length = 2;
console.log(arr); // [1, 2]

🏗️

constructor

Returns Array constructor function

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

🔹 Mutating Methods (Change Original Array)

Adding/Removing Elements:

push() - Add elements to end
pop() - Remove last element
unshift() - Add elements to beginning
shift() - Remove first element
splice() - Add/remove elements at any position

let fruits = ["apple", "banana"];

// Adding elements
fruits.push("orange");        // ["apple", "banana", "orange"]
fruits.unshift("grape");      // ["grape", "apple", "banana", "orange"]

// Removing elements
fruits.pop();                 // ["grape", "apple", "banana"]
fruits.shift();               // ["apple", "banana"]

// Splice - remove 1 element at index 1, add "kiwi"
fruits.splice(1, 1, "kiwi");  // ["apple", "kiwi"]

🔹 Non-Mutating Methods (Return New Array)

Array Transformation:

concat() - Join arrays
slice() - Extract portion of array
map() - Transform each element
filter() - Filter elements by condition
reduce() - Reduce to single value

const numbers = [1, 2, 3, 4, 5];

// Transformation methods
const doubled = numbers.map(n => n * 2);      // [2, 4, 6, 8, 10]
const evens = numbers.filter(n => n % 2 === 0); // [2, 4]
const sum = numbers.reduce((a, b) => a + b);   // 15

// Extraction methods
const portion = numbers.slice(1, 3);          // [2, 3]
const combined = numbers.concat([6, 7]);      // [1, 2, 3, 4, 5, 6, 7]

🔹 Search Methods

Finding Elements:

indexOf() - First index of element
lastIndexOf() - Last index of element
includes() - Check if element exists
find() - First element matching condition
findIndex() - Index of first match

const fruits = ["apple", "banana", "apple", "orange"];

// Search methods
console.log(fruits.indexOf("apple"));     // 0
console.log(fruits.lastIndexOf("apple")); // 2
console.log(fruits.includes("banana"));   // true

const users = [{name: "John", age: 25}, {name: "Jane", age: 30}];
const user = users.find(u => u.age > 28); // {name: "Jane", age: 30}
const index = users.findIndex(u => u.age > 28); // 1

🔹 Iteration Methods

Looping Through Arrays:

forEach() - Execute function for each element
map() - Transform and return new array
filter() - Filter elements by condition
reduce() - Reduce to single value
some() - Test if any element passes
every() - Test if all elements pass

const numbers = [1, 2, 3, 4, 5];

// Iteration methods
numbers.forEach(n => console.log(n));        // Logs each number
const doubled = numbers.map(n => n * 2);     // [2, 4, 6, 8, 10]
const evens = numbers.filter(n => n % 2 === 0); // [2, 4]
const sum = numbers.reduce((a, b) => a + b); // 15
const hasEven = numbers.some(n => n % 2 === 0); // true
const allPositive = numbers.every(n => n > 0);  // true

🔹 Sorting Methods

Arranging Elements:

sort() - Sort elements (mutates original)
reverse() - Reverse array order (mutates original)

// String sorting
let fruits = ["banana", "apple", "orange"];
fruits.sort();                    // ["apple", "banana", "orange"]
fruits.reverse();                 // ["orange", "banana", "apple"]

// Number sorting (requires compare function)
let numbers = [3, 1, 4, 1, 5];
numbers.sort((a, b) => a - b);    // [1, 1, 3, 4, 5] ascending
numbers.sort((a, b) => b - a);    // [5, 4, 3, 1, 1] descending

🔹 Conversion Methods

Converting Arrays:

toString() - Convert to string
join() - Join elements with separator
Array.from() - Create array from iterable
Array.isArray() - Check if value is array

const fruits = ["apple", "banana", "orange"];

// Conversion methods
console.log(fruits.toString());      // "apple,banana,orange"
console.log(fruits.join(" - "));     // "apple - banana - orange"

// Static methods
console.log(Array.isArray(fruits));  // true
const arr = Array.from("hello");     // ["h", "e", "l", "l", "o"]
const range = Array.from({length: 5}, (_, i) => i); // [0, 1, 2, 3, 4]

🔹 Quick Reference Table

Method	Purpose	Mutates	Returns
`push()`	Add to end	Yes	New length
`pop()`	Remove from end	Yes	Removed element
`map()`	Transform elements	No	New array
`filter()`	Filter elements	No	New array
`reduce()`	Reduce to single value	No	Single value