JavaScript Type Conversion

JavaScript is a loose language. A value can be a number one minute and a string the next, and JavaScript will happily change it for you — sometimes when you did not ask. That is called type conversion. You need it all the time, because the most common source of values — a form on a web page — always gives you strings, even when the user types a number.

Diagram — see how it fits together

Think of a chai shop order form. The customer types 3 in the quantity box. JavaScript reads it as the string "3", not the number 3. If you add "3" + 1, you get "31" — the string and the number glued together. If you convert first with Number("3"), you get 3 + 1 = 4, the answer you wanted. One small conversion, one big difference.

Converting on purpose — Number, String, Boolean

JavaScript gives you three simple tools for changing a type on purpose:

• Number("42") turns a string into a number: 42. Number("hello") cannot be a number, so it gives NaN — "Not a Number". Number("") gives 0, and Number(true) gives 1.
• String(42) turns a number into a string: "42". String(true) gives "true". You use it when you want to join a value into a message.
• Boolean(1) gives true. Boolean(0), Boolean(""), Boolean(null) and Boolean(undefined) all give false — these are the falsy values. Everything else is truthy, including the string "0" and an empty array [].

You can also use shortcuts: +"42" (a plus sign in front) works like Number("42"), and "" + 42 works like String(42). They are short, but for a beginner the named functions are clearer — use them until the shortcuts feel natural.

== vs === — the question that decides interviews

JavaScript has two equality signs, and they are not the same. == (loose equality) converts the types first, then compares: "5" == 5 is true, because the string "5" becomes the number 5. === (strict equality) checks the type and the value, with no conversion: "5" === 5 is false, because a string is not a number.

Always use === unless you have a clear reason not to. Loose equality hides bugs — a string that looks like a number passes a check it should fail, and the mistake shows up far away from where it was made. The same rule applies to != and !==: prefer !==.

Truthy and falsy — the short list to memorise

When JavaScript needs a true/false answer — inside an if, for example — it converts the value with the Boolean rules. Only six values are falsy: false, 0, "" (empty string), null, undefined, and NaN. Everything else is truthy. That means if ("hello") runs, if (0) does not, and if ("0") runs — because "0" is a non-empty string, and non-empty strings are truthy.

This is useful for defaults. let name = input || "Guest"; gives "Guest" when the input is empty, because an empty string is falsy and the || moves on to the next value. You will see this pattern everywhere in real code.

Common mistakes

• Adding a form value without converting it — "3" + 1 is "31", not 4. Convert with Number() first.
• Using == and wondering why "5" == 5 is true — use === unless you truly want conversion.
• Checking value === NaN — it is always false. Use Number.isNaN(value).
• Thinking "0" is falsy — it is a non-empty string, so it is truthy. Only the empty string "" is falsy.
• Trusting Number("42px") — it gives NaN. parseInt("42px") gives 42, because it reads the number at the start and stops at the letters.

Remember

• Number(), String() and Boolean() convert a value on purpose.
• === checks type AND value; == converts first. Prefer ===.
• Only six values are falsy: false, 0, "", null, undefined, NaN.
• Form inputs are always strings — convert them before doing maths.
• === checks the face AND the name — type and value both.

Example explained

• <input id="qty" value="3"> — the quantity box. Whatever the user types, JavaScript reads it as a string.
• let qty = Number(document.getElementById("qty").value); — converts the string "3" into the number 3, so the maths works.
• let total = qty * 10; — 3 cups at ₹10 each is ₹30. Multiplication would convert the string by itself, but addition would not — so converting first keeps every operation safe.
• if (qty === 0) — strict equality: if the user typed 0, the number 0 matches, but the string "0" would not have matched before conversion.
• document.getElementById("out").textContent = "Total: ₹" + total; — shows the answer on the page. Here the + joins strings on purpose.