1.2 Variables and Data Types

Step 1 — Understanding what "typed" means: In some languages (like Java or C), when you create a variable you must declare what kind of data it holds — a number, text, a true/false value — and it can never hold anything else. JavaScript does not work that way.

Step 2 — What "dynamically" changes this: JavaScript decides the type of a variable from the value it currently holds, at the moment the code runs. The same variable can hold a number right now and text a moment later.

Answer: "Dynamically typed" means a variable's type is determined by the value stored in it at runtime, not fixed by the programmer ahead of time. For example:

▶ Press Run to see the output…

Step 1 — The first two special values: Infinity and -Infinity are numeric values that stand for "larger than any real number" and "smaller than any real number." They appear when math overflows, like 1 / 0, or when a number grows too big to be stored.

Step 2 — The third special value: NaN stands for "Not a Number." It is still a number-type value, but it appears when a math operation fails to produce a valid number — for example, "hello" * 3 or 0 / 0.

Answer: The three special numeric values are:

• Infinity — appears from 1 / 0 or numbers too large to represent.
• -Infinity — appears from -1 / 0 or numbers too negatively large.
• NaN ("Not a Number") — appears when a numeric operation has no valid result, such as "abc" - 5 or 0 / 0.

Step 1 — What each one represents: undefined is JavaScript's automatic "no value yet" marker. If you declare a variable and never assign it anything, its value is undefined. null, on the other hand, is a value you choose to assign — it means "I am deliberately setting this to nothing."

Step 2 — Deciding which to use: You never assign undefined on purpose — JavaScript supplies it. You use null when you want to say "this slot exists but is intentionally empty right now" — for example, a form field for a middle name that the person does not have.

Answer: undefined means a variable was declared but never given a value (JavaScript's default "empty" state). null is an explicit value a programmer assigns to say "intentionally empty." Use null when you want to mark something as empty on purpose; use undefined when you want to detect that something was never set:

▶ Press Run to see the output…

Step 1 — Trace the first line: let x = 10; creates a variable named x and stores the number 10 in it.

Step 2 — Trace the second and third lines: The next line, x = "ten";, overwrites that number with the text "ten" — no let again, because the variable already exists. This works thanks to dynamic typing. Finally, console.log(x); prints whatever x holds now, which is the string "ten".

Answer: The code prints ten. Because JavaScript is dynamically typed, reassigning x from a number to a string is perfectly legal:

▶ Press Run to see the output…

Step 1 — The typeof operator: typeof is a built-in operator that answers the question "what type of value is this?" It returns a string naming the type.

Step 2 — Check each value:

• typeof "hello" — the quotes mark a string, so the result is the string "string".
• typeof 42 — a plain number, so the result is "number".
• typeof null — here is the surprise: null is technically its own primitive type, but the operator reports "object".

Answer:

▶ Press Run to see the output…

The null result is a historical bug from the language's first version. It was never fixed because too much existing code depended on it, so typeof null still reports "object" today even though null is not an object.

Step 1 — What NaN means: NaN ("Not a Number") is the result JavaScript produces when an arithmetic operation has no meaningful numeric answer — for instance, "hello" - 3. It is not a special error message; it is a value that flows through your code like any other number.

Step 2 — Why the result stays NaN: Arithmetic with NaN cannot recover a real number, because the bad value has already poisoned the computation. Adding 1 to "not a number" still gives "not a number" — garbage in, garbage out. This is called propagation.

Answer: NaN + 1 equals NaN because once a computation contains a non-numeric result, every further operation on it remains non-numeric. The "badness" spreads through the math:

▶ Press Run to see the output…

Step 1 — What double quotes do: A double-quoted string (like "Hello") is a plain, literal piece of text. What you write is exactly what you get — no way to insert the value of a variable or a calculation into the middle of it.

Step 2 — What backticks add: Backtick strings (like `Hello`), called template literals, can embed expressions directly using ${...}. Whatever expression you place inside the curly braces is evaluated and inserted into the text. They also allow the string to span multiple lines.

Answer: Backtick strings (template literals) support embedded expressions with ${...} and multi-line text; double-quoted strings are plain text only. Example:

▶ Press Run to see the output…

Step 1 — The limit of regular numbers: Regular JavaScript numbers cannot safely represent integers beyond about 9 quadrillion (2⁵³ − 1). Beyond that, the computer silently rounds, so two different huge numbers can become the same value — a precision error.

Step 2 — What BigInt changes: A BigInt is a number type that can represent integers of any size, exactly. You create one by appending n to a number (like 12345678901234567890n). BigInts can only hold whole numbers, never decimals, and mixing a BigInt with a regular number in arithmetic is not allowed.

Answer: A BigInt is an integer type with no size limit, written with a trailing n:

▶ Press Run to see the output…

Use it whenever you work with integers larger than 9,007,199,254,740,991 (2⁵³ − 1) — for example, counting stars, astronomical distances, or database IDs that exceed that bound — where regular numbers would lose precision.

Step 1 — Declaring without assigning: let a; creates a variable named a but never gives it a value. The variable exists — it just holds nothing yet.

Step 2 — JavaScript's automatic default: When a declared variable has not been assigned, JavaScript automatically gives it the special value undefined (meaning "no value was ever set"). So console.log(a); prints that default value.

Answer: The code outputs undefined:

▶ Press Run to see the output…

No error occurs — an unassigned variable is perfectly legal in JavaScript; it simply holds the default value undefined.

Step 1 — Group the basic types: The seven primitive types are the "building blocks" of data in JavaScript. Start with the three value families: text, numbers, and true/false. Numbers split into two: ordinary numbers and BigInt. Then add the two "empty" values, and finally the newest member, symbols.

Step 2 — Check the list against what you know:

• string — text, in quotes or backticks.
• number — ordinary numbers, including Infinity and NaN.
• bigint — huge integers with an n.
• boolean — true or false.
• undefined — declared but never assigned.
• null — deliberately empty.
• symbol — a unique, unchangeable identifier (rarely used by beginners, but it is a primitive).

Answer: The seven primitive data types in JavaScript are: string, number, bigint, boolean, undefined, null, and symbol. You can verify any of them with typeof (with the known null quirk):

▶ Press Run to see the output…