Quest 1 • Lesson 2

📦 Variables & Data Types

Learn how to store and work with data in JavaScript using variables and different data types.

A variable is a named container for storing data. JavaScript gives you three ways to create variables: let, const, and var.

"Think of variables as labeled boxes where you store different types of items – numbers, text, true/false values, and more."

📦 The Three Ways to Declare Variables

const

Cannot be reassigned. Use for values that never change.

const PI = 3.14;

let

Can be reassigned. Use for values that change.

let score = 0;

var

Old way. Avoid using it in modern JavaScript.

var old = "avoid";

variables.js

// Using const (preferred)
const name = "Alice";
const age = 25;
const isStudent = true;

// Using let (when value changes)
let score = 0;
score = 100; // ✅ allowed

console.log(name, age, isStudent, score);

🔢 JavaScript Data Types

JavaScript has 8 data types. Here are the most common ones – click to explore each:

📝

String

"Hello"

🔢

Number

42, 3.14

✅

Boolean

true / false

🚫

Null

null

❓

Undefined

undefined

📦

Object

{ key: value }

📋

Array

[1, 2, 3]

⚙️

Function

function() {}

📝 String

A string is a sequence of characters wrapped in quotes (single or double).

const greeting = "Hello, World!";

🔍 Interactive Type Explorer

Type any value and see what data type JavaScript thinks it is.

Value: Hello, World!
Type: string

💡 Try this: Enter 42, true, 3.14, or Hello and see the type change!

🚀 Try It Live

Edit the code and run it in your browser.

Click "Run Code" to see the output.

🔎 The `typeof` Operator

Use typeof to check the type of any value.

typeof "Hello" // "string"
typeof 42 // "number"
typeof true // "boolean"
typeof undefined // "undefined"
typeof null // "object" (a known quirk!)
typeof [1, 2, 3] // "object"

✨ Template Literals (String Interpolation)

Use backticks ` ` and ${ } to embed variables in strings.

const name = "Alice";
const greeting = `Hello, ${name}!`;
console.log(greeting); // "Hello, Alice!"

⚠️ Common Mistakes

❌ Reassigning a const variable

const name = "Alice";
name = "Bob";  // ❌ TypeError: Assignment to constant variable

❌ Confusing null and undefined

undefined means a variable has been declared but has no value. null is an intentional absence of value.

💡 Pro Tips

Default to const, use let when needed.

This prevents accidental reassignments and makes your code more predictable.

Use descriptive variable names.

const userAge = 25; is much clearer than const x = 25;

✨ Challenge: Create a Profile

Create variables for a user profile:

const fullName — your full name
let age — your age
const isDeveloper — true or false
Print them using template literals.

📚 What's Next?

Lesson 1.3: Operators & Expressions → — math, comparison, logic.
← Previous: Lesson 1.1: Introduction to JavaScript
⚡ JavaScript Course Hub →

📤 Share This Lesson

Help others learn JavaScript!

❤️ Support Free Education

This course is 100% free. If it helps you, consider buying me a coffee.

☕ Buy Me a Coffee

← Back to JavaScript Course Hub

Master Code On The Go