JavaScript Type Coercion — What does this print?

Why This Question Matters

If you've spent any time in JavaScript, you've probably run into a situation where the language did something "weird" that you didn't expect. This specific snippet is a classic example of Type Coercion.

For junior developers, this is often a "gotcha" moment. Most languages are strict: if you try to subtract a number from a string, the compiler screams at you and refuses to run. JavaScript, however, tries to be "helpful." Instead of crashing, it attempts to guess what you meant and converts the types on the fly.

Understanding this is the difference between writing code that works by accident and writing code you actually control.

Understanding the Code

Let's look at the snippet again:

let x = "5"
let y = 3
console.log(x - y)

At first glance, we have a string ("5") and a number (3).

When JavaScript sees the subtraction operator (-), it triggers a specific internal process. Unlike the plus sign (+), which is overloaded to handle both addition and string concatenation, the minus sign has only one job: math.

Because the - operator only works with numbers, JavaScript looks at x and says, *"This is a string, but I need a number to perform subtraction."* It then automatically converts the string "5" into the numeric value 5.

This is called implicit coercion. The engine transforms the data type behind the scenes so the operation can complete without throwing an error.

Finding the Correct Answer

The correct answer is 2.

Here is why the other common guesses are wrong:

So, the logic flows like this: "5" $\rightarrow$ 5, then 5 - 3 = 2.

Common Mistakes Developers Make

The biggest mistake is assuming that because subtraction works this way, addition does too. This is where most bugs are born in junior JS code.

Check this out:

console.log("5" - 3); // 2 (Coercion to number)

console.log("5" + 3); // "53" (Coercion to string)

This inconsistency is a nightmare if you aren't paying attention. Imagine you're grabbing a value from an HTML input field. Input values are *always* strings. If you try to add a tax amount to a price retrieved from a form, you might end up with a price of "1005" instead of 105.

Another edge case is the "empty string." If you do "" - 1, JavaScript coerces the empty string to 0, resulting in -1. It's technically consistent, but logically confusing.

Real-World Usage

In a professional production environment, relying on implicit coercion is generally considered a bad practice. It makes your code unpredictable and hard to debug.

If you're building a checkout system or a calculator, you should always be explicit about your types. Instead of letting JS guess, use Number(), parseInt(), or the unary plus operator.

Here is how a senior dev would handle this to avoid ambiguity:

const x = "5";
const y = 3;
// Use Number() for clarity

const result = Number(x) - y;
// Or the unary plus shortcut (common in minified code)

const result2 = +x - y;

By explicitly converting the string to a number, you tell anyone reading your code (including your future self) exactly what your intention was. It removes the guesswork and prevents those "why is my total 53 dollars?" bugs.

Key Takeaways