JavaScript Arrays
An array is an ordered list of values accessed by index (starting at 0). Arrays are objects that can hold any mix of data types and resize dynamically.
Creating Arrays
Array Literals
const fruits = ["Apple", "Banana", "Cherry"];
const mixed = [1, "hello", true, null];
const empty = [];
console.log(fruits);
console.log(fruits[0]); // Apple (index 0)
console.log(fruits[2]); // Cherry (index 2)
console.log(fruits.length); // 3Add and Remove Elements
push, pop, unshift, shift
const colors = ["red", "green", "blue"];
colors.push("yellow"); // add to end
console.log(colors); // ["red","green","blue","yellow"]
colors.pop(); // remove from end
console.log(colors); // ["red","green","blue"]
colors.unshift("white"); // add to start
console.log(colors); // ["white","red","green","blue"]
colors.shift(); // remove from start
console.log(colors); // ["red","green","blue"]Looping Over Arrays
Array Iteration
const nums = [10, 20, 30];
// for loop
for (let i = 0; i < nums.length; i++) {
console.log("for:", nums[i]);
}
// for...of (cleaner)
for (let n of nums) {
console.log("for...of:", n);
}
// forEach
nums.forEach((n, i) => console.log(`forEach [${i}]: ${n}`));Searching Arrays
Search Methods
const animals = ["cat", "dog", "bird", "dog"];
console.log(animals.indexOf("dog")); // 1 (first occurrence)
console.log(animals.lastIndexOf("dog")); // 3
console.log(animals.includes("bird")); // true
console.log(animals.includes("fish")); // false
const numbers = [4, 9, 16, 25];
console.log(numbers.find(n => n > 10)); // 16
console.log(numbers.findIndex(n => n > 10)); // 2Transforming Arrays
map, filter, reduce
const nums = [1, 2, 3, 4, 5];
const doubled = nums.map(n => n * 2);
console.log(doubled); // [2, 4, 6, 8, 10]
const evens = nums.filter(n => n % 2 === 0);
console.log(evens); // [2, 4]
const sum = nums.reduce((acc, n) => acc + n, 0);
console.log(sum); // 15Other Useful Methods
| Method | What It Does |
|---|---|
| sort() | Sorts elements (alphabetically by default) |
| reverse() | Reverses order in place |
| slice(start, end) | Returns a portion (does not mutate) |
| splice(idx, n) | Removes/inserts elements in place |
| concat(arr) | Merges arrays (returns new array) |
| join(sep) | Joins elements into a string |
| flat() | Flattens nested arrays one level |
| some(fn) | True if any element passes test |
| every(fn) | True if all elements pass test |
Sorting and Slicing
const scores = [30, 10, 50, 20, 40];
scores.sort((a, b) => a - b); // numeric ascending sort
console.log(scores); // [10, 20, 30, 40, 50]
const top3 = scores.slice(-3); // last 3 elements
console.log(top3); // [30, 40, 50]
const words = ["banana", "apple", "cherry"];
words.sort(); // alphabetical
console.log(words.join(", ")); // "apple, banana, cherry"📝 Note: Array.sort() converts elements to strings by default — always pass a comparator (a, b) => a - b for numeric sorting.
Exercise:
Which method adds an element to the end of an array?