Frontend Master

JavaScript Curriculum

What Kind of Thing Is This?
+25 XP

What Kind of Thing Is This?

easy
~12 min·25 XP

Your manager drops a new task: 'We need to store each team member's profile. Name, age, whether they're remote, their department, and their start date.' You open the editor. Name is text. Age is a number. Remote is yes or no. Department might not exist yet. Start date hasn't been set. You realise: these aren't all the same kind of thing. JavaScript has different types for a reason.

Why types exist

Look at this team member form your manager sent over:

js
Name: Alex Age: 28 Is Remote: yes Department: (TBD) Start Date: (not set yet)

Every one of these is a different kind of thing. You can't add a name to an age. You can't check if a department is greater than 10. Type is what tells JavaScript what a value is and what operations are legal on it.

JavaScript has 5 primitive types you'll use every single day.


The 5 primitives — interactive

Click each tab to explore the type, see a real example, and check how typeof reports it:

📝
stringText wrapped in quotes

Any sequence of characters. Always in quotes — single, double, or backtick.

example"Nexus"

used for: usernames, messages, URLs, errors

console.log(typeof "hello") // "string"

Strings — text, always in quotes

A string is any sequence of characters wrapped in quotes. You can use single, double, or backtick quotes:

js
const name = "Alex" // double quotes const role = 'engineer' // single quotes — both fine const greeting = `Hi, ${name}!` // backtick — lets you embed variables
💡Which quote style to use?
Use double quotes as your default. Use backticks when you need to embed a variable inside the text (template literals). Avoid mixing styles in the same file.

Strings have built-in powers you'll use constantly:

js
const company = "Nexus" console.log(company.length) // 5 console.log(company.toUpperCase()) // "NEXUS" console.log(company.includes("ex")) // true console.log(company[0]) // "N" — first character

Numbers — one type for integers and decimals

Unlike Java, Python, or C, JavaScript has just one number type — it handles both integers and decimals:

js
const userCount = 1042 // integer const taxRate = 0.18 // decimal const below = -12 // negative

Two special number values that will surprise you at first:

js
console.log(10 / 0) // Infinity — not an error! console.log("text" * 2) // NaN — "Not a Number"
⚠️NaN is still typeof 'number'
typeof NaN === "number" — this trips everyone up. NaN is a number-type value that means "this math went wrong". It's broken, but it's still a number type.

Booleans — true or false. nothing else.

Exactly two possible values. They power every decision in your code:

js
const isOnline = true const hasSubmitted = false

You'll create booleans from comparisons all the time:

js
const age = 25 const isAdult = age >= 18 // true const isExact = age === 18 // false — strict equality check const notDone = !hasSubmitted // true — negation

Every if statement you write will check a boolean. We cover that in Lesson 4.


null vs undefined — similar but meaningfully different

Both represent "no value" — but they signal different things to the programmer reading your code.

Step through these real-world scenarios:

null vs undefined — 1/3

Unassigned variable

null
const seat = null

You explicitly said: no value here

undefined
let seat

JS said: no value yet assigned

null = intentional empty  · undefined = not yet assigned

One-line rule: null = you said "nothing here on purpose." undefined = JavaScript said "nothing here yet."


typeof — checking types at runtime

The typeof operator tells you what type a value is. Click any value to see what it returns:

typeof inspector — click any valuestring
console.log(typeof "Nexus")
"string"
⚠️The typeof null bug — just memorise it
typeof null returns "object" — not "null". This is a bug from 1995 that's been in JavaScript for 30 years and can't be fixed without breaking the web. null is not an object. Just remember: typeof null === "object" is wrong but it's what you'll always get.

Types in a real Nexus feature

js
// Team member profile — all five types in one real example const memberName = "Alex" // string const yearsAtNexus = 3 // number const isRemote = true // boolean const department = null // null — not assigned yet (TBD) let startDate // undefined — not fetched yet // Check what each one is console.log(typeof memberName) // "string" console.log(typeof yearsAtNexus) // "number" console.log(typeof isRemote) // "boolean" console.log(typeof department) // "object" ← the null bug console.log(typeof startDate) // "undefined"
🧠Mental model: types are promises
When you write a string, you're promising JavaScript: treat this as text. When you write a number, you're saying: treat this as a quantity. Mixing them without care — like multiplying text — breaks the promise and gives you NaN or errors. Types are your contract with the language.

Quick-reference table

TypeExampleNeeds quotes?typeof
string"Alex", 'hi'✓ Always"string"
number42, 3.14, -5✗ Never"number"
booleantrue, false✗ Never"boolean"
nullnull✗ Never"object" ⚠️ bug
undefined(unassigned)"undefined"

Before the challenge

You're creating one variable per type. Three things to keep in mind:

  • null is a keyword — lowercase, no quotes: const x = null
  • let startDate with nothing after it — that's intentional. No =, no value. It will be undefined.
  • Use const for everything except startDate (which needs let since it's genuinely unset)

Challenge

Create five variables, one for each primitive type: a string called teamMember set to \"Alex\", a number called yearsExperience set to 3, a boolean called isRemote set to true, a variable called department set to null (department is TBD), and declare startDate with let but leave it unassigned. Then log all five with descriptive labels.

data-typesstringnumberbooleannullundefinedtypeofprimitives
What Kind of Thing Is This? | Nexus Learn