Complete JavaScript Course Module 2: Beginner: Variables and Data Types

JavaScript Data Types: Strings, Numbers, Booleans, null and undefined

  • Beginner
  • Lesson 2.2
  • 5 min read
  • 5 of 76 in the course

In short

JavaScript data types describe what kind of value you are working with: text, numbers, true/false or "nothing". Learn the primitive types and how to check them with typeof. What are data types? Every value in JavaScript has a type.

JavaScript data types describe what kind of value you are working with: text, numbers, true/false or "nothing". Learn the primitive types and how to check them with typeof.

What are data types?

Every value in JavaScript has a type. The type tells JavaScript what kind of value it is and what you can do with it. You can multiply two numbers, but multiplying two names makes no sense. You can make text uppercase, but not a number.

In real life, you do this naturally. A phone number, a price and a person's name are different kinds of information, and you treat them differently. JavaScript does the same.

The primitive data types in JavaScript

JavaScript has seven primitive types. "Primitive" means simple: a single value, not a collection of values. The five you will use every day are:

TypeWhat it storesExamples
StringText'Hello', "Paris", '42'
NumberAny number, whole or decimal42, 3.14, -7
BooleanOnly two values: yes or notrue, false
undefined"No value has been given yet"undefined
null"Empty on purpose"null
const city = 'Tokyo';          // string
const population = 14000000;   // number
const temperature = -2.5;      // number (decimals are numbers too)
const isCapital = true;        // boolean
let mayor;                     // undefined (no value yet)
const middleName = null;       // null (intentionally empty)

console.log(city, population, temperature, isCapital, mayor, middleName);
// Output: Tokyo 14000000 -2.5 true undefined null

A few things to notice:

  • Strings are always inside quotes. '42' with quotes is a string, not a number.
  • JavaScript has just one number type for both whole numbers and decimals.
  • Booleans are written true and false, without quotes. They are perfect for questions like "Is the user logged in?"

The two other primitive types are rare for beginners: BigInt stores whole numbers too large for the normal number type (written with an n at the end, like 12345678901234567890n), and Symbol creates unique identifiers used in advanced code.

How to check a type with typeof

The typeof operator tells you the type of a value. It gives back the type's name as a string. It's very useful when your code behaves strangely and you want to know what is really inside a variable.

console.log(typeof 'Hello');     // Output: string
console.log(typeof 42);          // Output: number
console.log(typeof '42');        // Output: string
console.log(typeof true);        // Output: boolean
console.log(typeof undefined);   // Output: undefined
console.log(typeof null);        // Output: object

Look at the last line. typeof null gives 'object', which is wrong. This is a famous bug from the first version of JavaScript in 1995. It was never fixed because fixing it would break millions of old websites. Just remember: null is its own primitive type, even though typeof says otherwise.

Common mistake: Thinking '5' and 5 are the same. One is text, the other is a number. Values that come from form fields and prompt() are always strings, even when the user types digits. You'll learn how to convert them in the Type Conversion lesson.

What is the difference between null and undefined?

Both mean "no value", but they are used differently:

  • undefined usually means a value was never given. A variable declared without a value is undefined. It's like an empty box that nobody has filled yet.
  • null means a developer chose "empty" on purpose. It's like a box with a note saying "intentionally left empty".
let selectedSeat;
console.log(selectedSeat);
// Output: undefined   (nothing has been chosen yet)

let couponCode = 'SAVE10';
couponCode = null;
console.log(couponCode);
// Output: null   (we removed the coupon on purpose)

In your own code, if you want to say "this has no value right now", use null. Let JavaScript use undefined for things that were never set.

Objects and arrays: a quick preview

Primitive values hold one thing. But often you want to group many values together, like all the details of a user. For that, JavaScript has objects and arrays. You'll study them in detail later; here is just a first look so you recognize them.

const user = { name: 'Amir', age: 31, isAdmin: false };   // an object
const colors = ['red', 'green', 'blue'];                  // an array (a list)

console.log(typeof user);     // Output: object
console.log(typeof colors);   // Output: object
console.log(user.name);       // Output: Amir
console.log(colors[0]);       // Output: red

An object stores values with names, like a form with labelled fields. An array stores values in order, like a numbered list. For typeof, both count as object.

Tip: JavaScript is a dynamically typed language. That means you don't write the type when you create a variable; JavaScript works it out from the value. This makes code quick to write, but you need to pay attention to what each variable holds.

Practice exercise

Create a "movie" profile with variables: the title (string), the release year (number), the rating out of 10 (decimal number), whether you have seen it (boolean), and the sequel title set to null (no sequel yet). Log each variable together with its typeof.

Hint: console.log(year, typeof year); prints both the value and its type on one line.

Key takeaways

  • Every value has a type; the main primitive types are string, number, boolean, undefined and null.
  • Use typeof to check a value's type, but remember that typeof null wrongly says 'object'.
  • undefined means "not set yet"; null means "empty on purpose".
  • '42' in quotes is a string, not a number.
  • Objects and arrays group many values; you'll learn them later in the course.