JavaScript Array Checking — Which Method is Better?

Why This Question Matters

If you're just starting with JavaScript, typeof feels like the obvious tool for the job. You want to know if a variable is a string? typeof. A number? typeof. So, naturally, when you need to check if a variable is an array, you try typeof myVariable === 'array'.

Then you run your code, and it fails. Not because of a syntax error, but because JavaScript is doing something weird behind the scenes.

This is a classic "gotcha" in the language. It's one of those moments where the intuitive way of doing things is actually wrong. Understanding why this happens isn't just about passing a technical interview; it's about understanding how JavaScript handles data types and objects.

Understanding the Code

Let's look at the two options from the challenge:

// Option A
typeof [] === "array"
// Option B

Array.isArray([])

In Option A, we are using the typeof operator. This operator is designed to return a string indicating the type of the unevaluated operand. For example, typeof 42 returns "number" and typeof "hello" returns "string".

In Option B, we are calling a static method on the Array constructor. Array.isArray() was specifically added to the language to solve the exact problem that typeof fails at.

To understand why Option A fails, we have to look at how JavaScript views arrays. In JS, arrays aren't a separate primitive type. They are actually a specialized type of Object.

If you run typeof [] in your console, you won't get "array". You'll get "object". Because an array is technically an object, typeof [] === "array" will always return false.

Finding the Correct Answer

The correct answer is Option B: Array.isArray([]).

Why? Because Array.isArray() doesn't care about the general "object" category. It checks the internal internal slot of the object to see if it's actually an array. It returns a simple boolean: true if it's an array, false if it's anything else.

If you're wondering why we can't just use typeof and check for "object", consider this:

const user = { name: "Dev" };
const list = [1, 2, 3];
console.log(typeof user); // "object"

console.log(typeof list); // "object"

If you only use typeof, you can't tell the difference between a standard object, an array, or even null (which, famously, also returns "object" due to a legacy bug in the language). Array.isArray() is the only reliable, modern way to distinguish an array from other objects.

Common Mistakes Developers Make

The biggest mistake juniors make is assuming that every data structure has its own typeof string. It doesn't.

Another common mistake is trying to use instanceof Array. You'll see this in older tutorials:

const arr = [];
console.log(arr instanceof Array); // true

While this works most of the time, it breaks when you're dealing with multiple execution contexts, like iframes. If an array is created in one iframe and passed to another, instanceof will return false because the array comes from a different global environment (a different Array constructor).

Array.isArray() is the "gold standard" because it works across different frames and windows.

Real-World Usage

In a real production codebase, you'll rarely see Array.isArray() used in isolation. You'll usually see it inside a utility function or a validation check before running a loop.

Imagine you're building a function that processes a list of user IDs. You can't be 100% sure that the API response will always be an array; sometimes it might return a single object if only one user is found, or null if none are found.

If you try to call .map() or .forEach() on something that isn't an array, your app will crash with a TypeError.

Here is how you'd handle that in a real scenario:

function processUsers(data) {
  if (!Array.isArray(data)) {
    console.error("Expected an array but got something else.");
    return;
  }
data.forEach(user => {

    console.log(Processing ${user.name}...);

  });

}

By checking Array.isArray() first, you make your code resilient. You're preventing a crash before it happens, which is the hallmark of a professional developer.

Key Takeaways

- typeof is great for primitives (strings, numbers, booleans) but useless for distinguishing arrays from objects.
- typeof [] returns "object", not "array".
- Array.isArray() is the most reliable way to check for an array, even across different iframes.
- Avoid instanceof Array if you're working with complex environments.
- Always validate your data before calling array methods like .map() or .filter() to avoid runtime errors.