Array Methods You Must Know

1. push() — The "Add at Last" Method
Think of push() as a quick way to add something to the very end of your list. It doesn’t matter if it’s a number or a string like "yes"—it just goes to the last index.
Example: You have a small shopping list, and you remember one more thing.
State Before:
[1, 2, 3]
let arr = [1, 2, 3];
arr.push(4); // Adding a number
arr.push("yes"); // Adding a string
- State After:
[1, 2, 3, 4, "yes"]
2. pop() — The "Remove Last" Method
This is the opposite of push. It just grabs the very last item and kicks it out of the array.
- State Before:
["apple", "banana", "cherry"]
let fruits = ["apple", "banana", "cherry"];
fruits.pop();
- state After:
["apple", "banana"]
3. shift() and unshift() — Working at the Front
While push and pop work at the back, these two work at the start of the array.
unshift(): Pushes a new item to the front (index 0).
shift(): Removes the very first item.
let queue = ["item1", "item2"];
queue.unshift("VIP"); // Now: ["VIP", "item1", "item2"]
queue.shift(); // Now: ["item1", "item2"]
4. forEach() — The Loop Alternative
Instead of writing a complex for loop to look at every item, forEach just "visits" every element and lets you do something with it.
let names = ["alice", "bob"];
names.forEach((name) => {
console.log("hello " + name);
});
5. map() — The "Transformer"
This is where the magic happens. map() takes your array, changes every item based on your rule, and gives you a brand new array.
The Old Way (For Loop):
let nums = [1, 2, 3];
let doubled = [];
for(let i=0; i < nums.length; i++) {
doubled.push(nums[i] * 2);
}
The New Way (map):
let nums = [1, 2, 3];
let doubled = nums.map(n => n * 2);
State Before:
[1, 2, 3]State After:
[2, 4, 6]
6. filter() — The "Security Guard"
filter() looks at your items and only keeps the ones that follow your rule. It’s like a bouncer at a club.
The Old Way (For Loop):
let scores = [5, 12, 8, 20];
let highScores = [];
for(let i=0; i < scores.length; i++) {
if(scores[i] > 10) highScores.push(scores[i]);
}
The New Way (filter):
let scores = [5, 12, 8, 20];
let highScores = scores.filter(s => s > 10);
State Before:
[5, 12, 8, 20]State After:
[12, 20]
7. reduce() — The "Accumulator" (Simple Explanation)
Imagine you have a piggy bank. reduce() goes through your array, takes each number, and adds it into the piggy bank until you have one final total.
The Accumulator: Your piggy bank.
The Current: The coin you are currently holding.
let wallet = [10, 20, 30];
let total = wallet.reduce((piggyBank, coin) => {
return piggyBank + coin;
}, 0); // 0 is the starting amount in the piggy bank




