Variables and Data Types in JavaScript Programming

If you are learning JavaScript and it keeps doing things that make no sense — comparing two values that look equal and getting false, adding a number to a string and getting nonsense, a variable that is somehow 'undefined' — you are not doing anything wrong. You have run into JavaScript's type system, which is famously quirky, and it trips up almost everyone at the start. The good news is that these quirks follow rules, and once you know the rules, the surprises stop.

Variables and data types are the foundation of JavaScript, and getting them right early is the difference between fighting the language and working with it. This guide covers what a variable really is in JavaScript, how its types behave, and — crucially — the coercion quirks that cause the most beginner confusion, so you can stop being ambushed by them.

let, const, and the var you should avoid

JavaScript gives you three ways to declare a variable, and choosing correctly prevents a class of bugs. Use const for values that will not be reassigned — which is most of them — and let for values that will change. The older var still works but has confusing scope behaviour that causes subtle bugs, and modern JavaScript avoids it almost entirely.

const name = "Ada";   // won't be reassigned
let score = 0;         // will change
score = 10;            // fine
// name = "Bob";       // error: can't reassign a const

The simple rule — reach for const first, use let only when you genuinely need to reassign, and avoid var — is one that professional developers follow, and adopting it early makes your code clearer and safer. It signals intent: a reader seeing const knows that value will not change, which makes the code easier to reason about. This is a small habit with an outsized effect on how maintainable your JavaScript becomes.

The types, and the ones that surprise you

JavaScript has a handful of basic types: numbers, strings, booleans, plus the special values null and undefined, and the containers arrays and objects. Most behave sensibly. Two catch everyone out. undefined means a variable exists but has no value yet; null means a deliberate 'no value'. They are subtly different, and telling them apart matters.

let x;
console.log(x);           // undefined -- declared but not set
console.log(typeof null); // 'object' -- a famous JavaScript bug!
console.log(NaN === NaN); // false -- NaN never equals itself

Two genuine oddities to simply know: typeof null returns 'object', which is a long-standing bug in the language that will never be fixed for compatibility reasons; and NaN, the 'not a number' value you get from invalid maths, is never equal to anything, including itself. These are not things you can reason out — they are quirks you memorise once and then recognise forever. Knowing they exist saves you from the baffling debugging sessions they otherwise cause.

Type coercion: the source of the weirdness

Here is the heart of JavaScript's reputation for strangeness. When you use values of different types together, JavaScript quietly converts one to match the other — this is coercion — and the rules are not always intuitive. The plus operator is the biggest culprit, because it means both 'add numbers' and 'join strings', and the string meaning wins whenever a string is involved.

console.log("5" + 3);   // '53'  -- number coerced to string, joined
console.log("5" - 3);   // 2     -- minus has no string meaning, so both become numbers
console.log(0.1 + 0.2);  // 0.30000000000000004  -- floating point

So '5' + 3 gives the string '53', while '5' - 3 gives the number 2, because minus only means subtraction and forces both sides to numbers. This inconsistency is exactly what makes beginners feel JavaScript is playing tricks. It is not — it is following coercion rules — but they are rules you have to learn rather than guess. And the floating-point result of 0.1 + 0.2 is not a JavaScript bug but a fact of how all computers store decimals; it just surprises people the first time.

Type coercion is the single biggest source of confusion for new JavaScript developers, and the errors it causes look completely mysterious until someone points at the rule underneath. If you have lost an evening to a comparison that should have been simple, that is normal — and it is precisely the kind of thing that takes minutes to fix with someone who can see your screen. Our JavaScript tutoring starts from your actual bug, not a textbook.

== versus ===: the most important rule in JavaScript

If you take one thing from this entire guide, take this: use triple-equals (===), not double-equals (==). The difference is coercion. Loose equality (==) converts types before comparing, which produces genuinely bewildering results; strict equality (===) compares without converting, which is almost always what you actually want.

console.log("5" == 5);    // true   -- coerces, then compares
console.log("5" === 5);   // false  -- different types, so not equal
console.log(0 == "");     // true   -- both coerce to falsy... surprise
console.log(null == undefined); // true -- another coercion special case

Loose equality is responsible for a huge share of JavaScript bugs, because comparisons you expect to be false come out true after coercion — 0 equals an empty string, null equals undefined. Professional JavaScript code uses strict equality almost universally for exactly this reason. Making === your default from day one will save you from a category of bugs that otherwise haunt beginners for months. It is the single highest-value habit in the language.

Objects and arrays: reference, not copy

JavaScript's containers — arrays for ordered lists, objects for key-value pairs — are the workhorses of real code, and they carry one behaviour that surprises beginners. When you assign an object or array to another variable, you copy the reference, not the contents, so both variables point at the same underlying data. Changing it through one is visible through the other.

const a = [1, 2, 3];
const b = a;      // b points at the SAME array
b.push(4);
console.log(a);   // [1, 2, 3, 4] -- a changed too

This is the same reference behaviour that Python and most languages share, and it is the source of many 'why did my data change?' bugs. Understanding that objects and arrays are handled by reference — while simple values like numbers and strings are copied — is essential to predicting how your code behaves. When you genuinely need an independent copy, JavaScript gives you ways to make one, but first you have to know that a plain assignment does not.

Template literals: the clean way to build text

Because combining strings and values with the plus operator triggers all the coercion confusion above, modern JavaScript gives you a far cleaner tool: template literals. Written with backticks instead of quotes, they let you drop variables directly into text, so you never have to join strings and numbers by hand or worry about accidental coercion.

const name = "Ada";
const age = 36;
console.log(`${name} is ${age} years old`);   // Ada is 36 years old
// versus the error-prone: name + " is " + age + " years old"

Template literals have become the standard way to build strings in JavaScript, and adopting them early sidesteps a whole category of the concatenation bugs beginners run into. They read more clearly, they handle values of any type without you converting anything, and they even span multiple lines cleanly. It is one of those modern features that makes JavaScript genuinely pleasant, and using it from the start marks code as current rather than dated.

The console is your best friend

Every browser has a developer console, and console.log is the single most useful tool a JavaScript beginner has. When you cannot understand why a variable holds what it does — is it a string or a number? undefined or null? — you print it and look. This simple habit resolves the majority of the type confusion this guide describes, because it lets you see reality instead of guessing at it.

Beyond just printing values, the console tells you the type when you inspect them, shows you the exact line where errors occur, and lets you experiment with snippets of code live. Beginners who treat the console as their constant companion — printing values whenever something surprises them — debug far faster than those who stare at code trying to reason it out. When JavaScript's quirks bite, the console is how you catch them in the act, and building the habit of reaching for it immediately is one of the most practical skills you can develop.

Where JavaScript beginners actually go wrong with types

• Using == instead of ===, and getting bewildering true/false results from coercion.
• Being surprised by '5' + 3 versus '5' - 3, not knowing the plus/minus coercion rules.
• Confusing null and undefined, or being tripped by typeof null === 'object'.
• Expecting NaN to equal itself, or 0.1 + 0.2 to equal exactly 0.3.
• Assuming an assigned array or object is a copy, when it is a shared reference.

How to master JavaScript variables and types

• Use const by default, let when you must reassign, and never var.
• Always use === for comparisons, so coercion never surprises you.
• Learn the plus/minus coercion rules rather than guessing at mixed-type results.
• Memorise the handful of quirks — typeof null, NaN, floating point — once.
• Remember objects and arrays are references; make a real copy when you need one.

Turn JavaScript's quirks into an advantage

Every quirk in this guide — coercion, ==, typeof null, NaN — is a known, fixable gap, not a sign you are not cut out for programming. The developers who get good fastest are simply the ones who stop guessing and get the rules explained clearly, then move on. Our JavaScript tutoring in Burnaby and online does exactly that: we work from the errors you are actually hitting and hand you the underlying rule, so the same bug never costs you a second evening.

Booking costs nothing and commits you to nothing. Book a free 30-minute consultation, bring the code that is confusing you, and we will pinpoint the gap and show you how fast it closes — in person in Burnaby or online across Metro Vancouver. If you do not need tutoring, we will say so honestly.