Variables and Data Types

In this lesson, you'll learn how to store information in variables and work with different types of data. Variables are like labeled boxes where you can store values and use them later in your code.

What You'll Learn

How to declare variables using let, const, and var
The different data types in JavaScript
How to work with strings, numbers, and booleans
Type conversion and checking

Declaring Variables

JavaScript has three ways to declare variables:

// let - for variables that can change
let age = 25;
console.log("Age:", age);

age = 26; // We can change it
console.log("New age:", age);

// const - for variables that won't change
const birthYear = 1998;
console.log("Birth year:", birthYear);

// birthYear = 1999; // This would cause an error!

// var - old way (avoid using this)
var name = "Alice";
console.log("Name:", name);

Best Practice: Use const by default. Only use let when you know the variable will change. Avoid var.

Basic Data Types

JavaScript has several built-in data types. Let's explore the most common ones:

Strings

Strings are used for text. You can use single quotes, double quotes, or backticks:

// Different ways to create strings
let greeting = "Hello";
let name = 'JavaScript';
let message = `Welcome to ${name}!`; // Template literal

console.log(greeting);
console.log(name);
console.log(message);

// String concatenation
let fullGreeting = greeting + ", " + name + "!";
console.log(fullGreeting);

Numbers

JavaScript has one number type for both integers and decimals:

// Integers
let count = 42;
console.log("Count:", count);

// Decimals (floating-point)
let price = 19.99;
console.log("Price:", price);

// Mathematical operations
let sum = 10 + 5;
let difference = 10 - 5;
let product = 10 * 5;
let quotient = 10 / 5;
let remainder = 10 % 3;

console.log("Sum:", sum);
console.log("Difference:", difference);
console.log("Product:", product);
console.log("Quotient:", quotient);
console.log("Remainder:", remainder);

Booleans

Booleans represent true or false values:

let isLearning = true;
let isComplete = false;

console.log("Is learning:", isLearning);
console.log("Is complete:", isComplete);

// Comparison operations return booleans
console.log("5 > 3:", 5 > 3);
console.log("5 < 3:", 5 < 3);
console.log("5 === 5:", 5 === 5);
console.log("5 !== 3:", 5 !== 3);

Undefined and Null

Two special values for "nothing":

// undefined - variable declared but not assigned
let notDefined;
console.log("Not defined:", notDefined);

// null - intentionally empty
let empty = null;
console.log("Empty:", empty);

Type Checking

You can check the type of a value using typeof:

console.log(typeof "Hello");        // "string"
console.log(typeof 42);             // "number"
console.log(typeof true);           // "boolean"
console.log(typeof undefined);      // "undefined"
console.log(typeof null);           // "object" (this is a JavaScript quirk!)

Type Conversion

JavaScript can convert between types:

// String to Number
let strNumber = "42";
let num = Number(strNumber);
console.log("String to number:", num);
console.log("Type:", typeof num);

// Number to String
let number = 42;
let str = String(number);
console.log("Number to string:", str);
console.log("Type:", typeof str);

// Automatic conversion (coercion)
console.log("5" + 3);     // "53" (string concatenation)
console.log("5" - 3);     // 2 (numeric subtraction)
console.log("5" * "2");   // 10 (numeric multiplication)

Try It Yourself

Practice what you've learned! Create variables and try these exercises:

// 1. Create a variable for your name (string)
const myName = "Your Name";
console.log("My name is:", myName);

// 2. Create a variable for your age (number)
let myAge = 25;
console.log("I am", myAge, "years old");

// 3. Calculate your birth year (approximately)
const currentYear = 2024;
const birthYear = currentYear - myAge;
console.log("I was born in:", birthYear);

// 4. Create a boolean for whether you like coding
const likesCoding = true;
console.log("Likes coding:", likesCoding);

// Try modifying the values and adding your own variables!

Key Takeaways

Use const for values that don't change, let for values that do
JavaScript has several data types: strings, numbers, booleans, undefined, and null
Strings can be created with quotes or backticks (template literals)
Use typeof to check a value's type
JavaScript can automatically convert between types (type coercion)

Next Steps

Now that you understand variables and data types, you're ready to learn about functions - reusable blocks of code that make your programs more organized and powerful!

Pro Tip: Try printing different types of values and see how they behave. Experiment with mathematical operations and string concatenation to get comfortable with how JavaScript handles different data types.

Variables and Data Types

Also learn

Also learn