0Pricing
Frontend Academy · Lesson

Data Types: string number boolean null undefined

Explore JavaScript's primitive types, use typeof to inspect them, and learn the difference between null and undefined.

Data Types: string number boolean null undefined is a free Frontend Academy lesson on CoddyKit — lesson 2 of 4. You can read the complete lesson below for free — then practise it hands-on in the browser with a built-in code editor and a 24/7 AI tutor. It is part of the Frontend Academy learning path, one of 4 lessons in the course, and your progress syncs across the web and the CoddyKit app.

JavaScript's Type System

JavaScript is dynamically typed — variables don't have types, values do. The same variable can hold a string, then a number, then null. Understanding the seven primitive types prevents a huge class of bugs.

string

Strings represent text. Use single quotes, double quotes, or backtick (template literal). They are immutable — string methods return new strings. Strings have a .length property and many built-in methods.

const greeting = 'Hello';
const lang = "JavaScript";
const sentence = `I love ${lang}`;  // template literal

console.log(greeting.length);   // 5
console.log('hello'.toUpperCase()); // 'HELLO'
console.log(' trim me '.trim()); // 'trim me'

number

JavaScript has a single numeric type. All numbers — integers and floats — are 64-bit floating-point (IEEE 754). This means 0.1 + 0.2 !== 0.3. Special values: Infinity, -Infinity, and NaN (Not a Number).

const age = 30;
const price = 19.99;
console.log(0.1 + 0.2);          // 0.30000000000000004
console.log(typeof NaN);          // 'number'
console.log(isNaN('hello'));      // true
console.log(Number.isNaN('hello')); // false (safer check)

boolean

Booleans are true or false. Used in conditionals and comparisons. Every value in JavaScript has an inherent truthiness: falsy values are false, 0, '', null, undefined, NaN. Everything else is truthy.

const isActive = true;
const isAdmin = false;

// Falsy values:
if (0) { /* never runs */ }
if ('') { /* never runs */ }
if (null) { /* never runs */ }

null

null is an explicitly assigned empty value. It means "no value intentionally". Use null when you want to clear a variable or signal absence. typeof null === 'object' is a famous JavaScript bug kept for legacy compatibility.

let selectedUser = null;  // no user selected yet
selectedUser = { name: 'Alice' };
selectedUser = null;       // cleared

undefined

undefined means a value hasn't been assigned yet. Variables declared but not initialised are undefined. Missing function arguments are undefined. Missing object properties return undefined.

let x;                       // undefined
function greet(name) {
  console.log(name);           // undefined if called as greet()
}
const obj = {};
console.log(obj.foo);         // undefined

null vs undefined

null = intentionally absent. undefined = not yet assigned. As a rule: let the engine set undefined, use null explicitly in your own code when you mean "empty".

typeof Operator

Use typeof to inspect a value's type at runtime. It returns a string: 'string', 'number', 'boolean', 'undefined', 'object', 'function', 'bigint', 'symbol'. Remember: typeof null === 'object' is a known bug.

typeof 'hello'     // 'string'
typeof 42          // 'number'
typeof true        // 'boolean'
typeof undefined   // 'undefined'
typeof null        // 'object' ← historical bug
typeof {}          // 'object'
typeof []          // 'object'
typeof function(){} // 'function'

Symbol and BigInt

Symbol: unique, immutable identifier — used for object property keys that won't collide. BigInt: integers larger than Number.MAX_SAFE_INTEGER (2^53-1). Created with 42n or BigInt(42). Not needed for most frontend work.

Type Coercion Gotchas

JavaScript silently converts types in comparisons and operations. Use === (strict equality) not == (loose equality) to avoid coercion surprises.

0 == false        // true (coercion)
0 === false       // false (strict, no coercion)
'' == false       // true
'5' == 5          // true
'5' === 5         // false ✓ use this

Type Conversion

Convert types explicitly with Number(), String(), Boolean(), or parseInt() / parseFloat(). Explicit conversion is always clearer than relying on coercion.

Number('42')      // 42
Number('')        // 0
Number('abc')     // NaN
String(42)        // '42'
Boolean(0)        // false
Boolean('hello')  // true
parseInt('10px')  // 10

Quick Check

What does typeof null return in JavaScript?

Recap: JavaScript Data Types

Seven primitives: string, number, boolean, null, undefined, symbol, bigint. Use typeof to inspect types. Use === for comparisons to avoid coercion. Distinguish null (intentional empty) from undefined (not yet set). All other values are objects.

Frequently asked questions

Is the “Data Types: string number boolean null undefined” lesson free?

Yes — the full text of “Data Types: string number boolean null undefined” is free to read here on the web, and the Frontend Academy course includes 4 lessons in total. To practise it interactively (a built-in code editor and a 24/7 AI tutor) and unlock the rest of the Frontend Academy course, upgrade to CoddyKit PRO.

What will I learn in “Data Types: string number boolean null undefined”?

Explore JavaScript's primitive types, use typeof to inspect them, and learn the difference between null and undefined. You practise Frontend Academy with hands-on code you run directly in the browser, and a 24/7 AI tutor answers your questions as you work through the lesson.

Do I need any experience to start Frontend Academy?

No prior experience is required. Frontend Academy on CoddyKit is structured for beginners through advanced learners; this is — lesson 2 of 4, so you can start here or from the beginning and move at your own pace.

How long does the “Data Types: string number boolean null undefined” lesson take?

Most CoddyKit lessons take about 5–10 minutes. Each one is bite-sized and interactive, so you make steady progress and pick up exactly where you left off across the web and the app.

Can I write and run code in this Frontend Academy lesson?

Yes. Every Frontend Academy lesson includes a built-in code editor, so you write and run real code right in your browser and get instant AI feedback — no local setup required.

All lessons in this course

  1. Variables: let const var and Scope
  2. Data Types: string number boolean null undefined
  3. Functions: declarations expressions arrow functions
  4. Control Flow: if else switch for while
← Back to Frontend Academy