Back to JavaScript Fundamentals

Primitive Types in JavaScript

A comprehensive guide to understanding JavaScript's primitive data types - the fundamental building blocks of the language.
5 min readLogan FordLogan Ford

Introduction to Primitive Types

In JavaScript, primitive types are the foundational building blocks that store simple data values. Unlike objects, primitives are immutable - meaning their values cannot be modified after creation. When you assign a primitive value to a variable, you're working directly with that value rather than a reference.

There are seven primitive types in JavaScript:

  1. Number - For both integers and floating-point numbers
  2. String - For text and character sequences
  3. Boolean - For true/false values
  4. Null - For intentionally empty or non-existent values
  5. Undefined - For uninitialized variables
  6. Symbol - For unique identifiers
  7. BigInt - For numbers larger than ±(2^53 - 1)

Let's explore each type in detail to understand their characteristics and use cases.

Number

The Number type in JavaScript represents both integers and floating-point numbers using a 64-bit format (IEEE 754). This means it can precisely represent integers up to ±(2^53 - 1).

1// Integer numbers
2let age = 25;
3let temperature = -10;
4
5// Floating-point numbers
6let pi = 3.14159;
7let price = 99.99;
8
9// Special number values
10let infinity = Infinity;
11let negativeInfinity = -Infinity;
12let notANumber = NaN;

String

Strings are sequences of characters used to represent text. They can be created using single quotes, double quotes, or backticks (template literals, learn more about template literals in JavaScript).

1// Different ways to create strings
2let singleQuotes = 'Hello world';
3let doubleQuotes = "JavaScript is awesome";
4let templateLiteral = `The sum is ${2 + 2}`;
5
6// String methods
7let text = "Hello";
8console.log(text.length); // 5
9console.log(text.toUpperCase()); // "HELLO"
10console.log(text[0]); // "H"

Boolean

Booleans represent logical values: true or false. They're essential for conditional statements and logical operations.

1// Boolean values
2let isActive = true;
3let isLoggedIn = false;
4
5// Boolean operations
6let hasPermission = true;
7let isAdmin = false;
8console.log(hasPermission && isAdmin); // false
9console.log(hasPermission || isAdmin); // true
10console.log(!isAdmin); // true

Null and Undefined

While both represent "empty" values, they serve different purposes:

1// Undefined - variable declared but not assigned
2let userName;
3console.log(userName); // undefined
4
5// Null - intentionally empty value
6let userProfile = null; // explicitly set to null
7let settings = {
8theme: null, // indicates no theme is set
9notifications: undefined // indicates setting hasn't been initialized
10};
11
12// Type checking
13console.log(typeof null); // "object" (a known JavaScript quirk)
14console.log(typeof undefined); // "undefined"

Symbol

Symbols are unique and immutable primitive values that can be used as keys for object properties. They're often used to add unique property keys to objects that won't collide with other keys.

1// Creating symbols
2const id = Symbol('id');
3const key = Symbol.for('key');
4
5// Using symbols as object keys
6const user = {
7[id]: 123,
8name: 'John'
9};
10
11// Symbols are always unique
12console.log(Symbol('id') === Symbol('id')); // false
13console.log(Symbol.for('key') === Symbol.for('key')); // true

BigInt

BigInt allows you to work with numbers larger than 2^53 - 1. They're created by appending 'n' to an integer or using the BigInt() constructor.

1// Creating BigInts
2const bigNumber = 9007199254740991n;
3const anotherBigNumber = BigInt("9007199254740991");
4
5// Operations with BigInts
6console.log(bigNumber + 1n); // 9007199254740992n
7console.log(bigNumber * 2n); // 18014398509481982n
8
9// Note: Can't mix BigInt with regular numbers
10// console.log(bigNumber + 1); // TypeError

Type Checking and Coercion

Understanding type checking and coercion is crucial when working with primitives:

1// Type checking
2console.log(typeof "hello"); // "string"
3console.log(typeof 42); // "number"
4console.log(typeof true); // "boolean"
5console.log(typeof Symbol()); // "symbol"
6console.log(typeof 42n); // "bigint"
7
8// Type coercion
9console.log("42" + 1); // "421" (string concatenation)
10console.log("42" - 1); // 41 (numeric operation)
11console.log(Boolean("")); // false
12console.log(Boolean("hello")); // true

Common Pitfalls and Best Practices

When working with primitive types, keep these best practices in mind:

  • Use strict equality (===) instead of loose equality (==) to avoid unexpected type coercion (learn more about loose vs strict equality in JavaScript)
  • Be explicit about type conversions using functions like String(), Number(), or Boolean()
  • Handle potential null or undefined values with optional chaining (?.) and nullish coalescing (??)
  • Use Number.isInteger() and Number.isFinite() for reliable number checking
1// Best practices examples
2// Type conversion
3const userInput = "42";
4const number = Number(userInput); // explicit conversion
5
6// Null checking
7const user = null;
8const userName = user?.name ?? "Anonymous";
9
10// Number validation
11console.log(Number.isInteger(42.0)); // true
12console.log(Number.isInteger(42.5)); // false

Accelerate Your JavaScript Journey

Ready to master JavaScript primitives and beyond? TechBlitz offers comprehensive JavaScript training with hands-on exercises, real-world projects, and expert guidance. Whether you're starting out or looking to deepen your understanding, our platform provides the resources you need to succeed. Join our community of developers and take your programming skills to the next level!

Learn to code, faster

Join 810+ developers who are accelerating their coding skills with TechBlitz.

Share this article