Top 10 JavaScript Array Methods You Probably Haven't Used Yet

By Saurabh Prajapati | IBM Software Engineer & Full-Stack Developer

---

Wait — Do You Really Know JavaScript Arrays?

Before we dive in, let me throw a quick challenge at you. What does this code output?

let fruits = ['apple', 'banana', 'mango'];
fruits.favorite = 'orange';
fruits[5] = "mango";

console.log(fruits.length);
console.log(fruits);

Drop your answer in the comments. I'll explain the twist at the end. 😄

---

So What Even Is an Array?

Simple answer: an array is a way to store multiple values in one variable.

let fruits = ["apple", "banana", "orange"];
let mixed = ["apple", 123, false, { name: "xyz" }];

You can throw anything in there — strings, numbers, booleans, even objects. JavaScript doesn't complain.

Here's something that blew my mind when I first learned it: arrays are objects in JavaScript. That's why they have built-in properties and methods. And that's also why the code challenge above behaves the way it does — you can add custom properties to arrays just like objects!

Now let's get to the fun part.

---

The 10 Array Methods Worth Knowing

#1 — copyWithin()

I'd never heard of this one until recently. It copies part of the array to another position within the same array — without changing its length.

A fun way to think about it: imagine a terminal command history that auto-shifts when you add a new command.

let history = [
  "npm start",
  "git status",
  "git add .",
  "git commit"
];

history.copyWithin(0, 1);
history[history.length - 1] = "git push";

console.log(history);
// ["git status", "git add .", "git commit", "git push"]

It "shifts everything left" and makes room for the new entry at the end. Honestly, weird at first — but kind of clever once you see it in action.

---

#2 — every()

This one checks if all elements pass a condition. Think of it like a quality gate in CI/CD.

const files = [
  { fileName: "login.js", coverage: 92 },
  { fileName: "signup.js", coverage: 88 },
  { fileName: "dashboard.js", coverage: 95 },
  { fileName: "profile.js", coverage: 90 }
];

const isCoverageGood = files.every(file => file.coverage >= 80);
console.log(isCoverageGood); // true

If even one file dips below 80%, it returns false. Super clean for validation logic.

---

#3 — reduce()

Okay, this one most developers have seen — but not everyone really gets it. The idea: take a whole array and boil it down to one value.

const numbers = [1, 2, 3, 4, 5];
const sum = numbers.reduce((acc, curr) => acc + curr, 0);
console.log(sum); // 15

Think of acc as your running total, and curr as the current item being processed. Once it clicked for me, I started using reduce() everywhere — for summing, grouping, building objects, you name it.

---

#4 — reduceRight()

Same idea as reduce(), but it starts from the right side of the array. Here's a fun example:

const words = ["ChaiCode", "the", "to", "Welcome"];

const sentence = words.reduceRight((acc, curr) => acc + " " + curr);
console.log(sentence); // "Welcome to the ChaiCode"

The array is in reverse order, and reduceRight() assembles it correctly. I wish I'd known this earlier — I used to reverse arrays manually first. 🤦

---

#5 — some()

While every() checks if all elements pass, some() checks if at least one does. Great for role-based access checks.

const user = {
  isLoggedIn: true,
  roles: ["member", "editor"]
};

const requiredRoles = ["admin", "editor"];

const hasAccess = user.isLoggedIn && user.roles.some(role => requiredRoles.includes(role));
console.log(hasAccess); // true

The user has "editor" in their roles, and that matches one of the required roles — so access granted. Clean, readable, and practical.

---

#6 — with()

This is a newer one and it's really handy. It returns a new array with one item replaced at a specific index — without mutating the original.

const students = ["Saurabh", "Hitesh", "Piyush"];
const updatedStudents = students.with(0, "Anirudh");

console.log(updatedStudents); // ["Anirudh", "Hitesh", "Piyush"]
console.log(students);        // ["Saurabh", "Hitesh", "Piyush"] — unchanged!

When working with React state or any immutable data pattern, this is a lifesaver. No more spreading and remapping just to change one element.

---

#7 — shift()

This removes the first element from an array and returns it.

const numbers = [1, 2, 3, 4, 5];
const first = numbers.shift();

console.log(first);   // 1
console.log(numbers); // [2, 3, 4, 5]

It does mutate the original array though, so use with care. Think of it like a queue — first in, first out.

---

#8 — unshift()

The opposite of shift() — it adds elements to the beginning of an array.

let presenters = ["Saurabh", "Pradip", "Yash"];
presenters.unshift("Rahul", "Amit");

console.log(presenters);
// ["Rahul", "Amit", "Saurabh", "Pradip", "Yash"]

Also mutates the original. I use this when I need to prepend items dynamically — like adding a "pinned" item to a list.

---

#9 — flatMap()

This one is a combo of map() and flat(). It maps over each element and then flattens the result by one level.

const numbers = [1, 2, [3, 4], 5];
const result = numbers.flatMap(n => Array.isArray(n) ? n : n);

console.log(result); // [1, 2, 3, 4, 5]

Where it really shines is when your map produces arrays and you don't want nested arrays in the output. I used this while building a chat message parser — each message could expand into multiple UI elements, and flatMap() kept things clean.

---

#10 — includes()

Simple but essential. Checks if an array contains a specific value.

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

console.log(numbers.includes(3)); // true
console.log(numbers.includes(6)); // false

Cleaner than using indexOf() !== -1 — which is what I used to do before I discovered this. 😅

---

The Challenge Answer

Remember the puzzle from the beginning?

let fruits = ['apple', 'banana', 'mango'];
fruits.favorite = 'orange';
fruits[5] = "mango";

console.log(fruits.length); // 6
console.log(fruits);
// ['apple', 'banana', 'mango', empty × 2, 'mango', favorite: 'orange']

The length is 6 because we set fruits[5] — JavaScript creates "empty" slots for the gaps. And fruits.favorite is a property on the array object, so it doesn't affect length at all. Arrays in JavaScript are more flexible (and weird) than they look!

---

Key Takeaways

• copyWithin() — shift data within the same array

• every() / some() — check conditions across elements

• reduce() / reduceRight() — collapse arrays into a single value

• with() — immutable single-element replacement (underrated!)

• shift() / unshift() — add/remove from the front

• flatMap() — map + flatten in one step

• includes() — clean existence check

---

About the Author

Saurabh Prajapati is a Full-Stack Software Engineer at IBM India Software Lab, where he builds cloud-native enterprise solutions on Maximo. He's passionate about GenAI, React, and modern web tech — and loves documenting his learning journey for fellow developers.

🔗 GitHub · LinkedIn · 📧 saurabhprajapati120@gmail.com · Available for work