01 - JavaScript Basics

What is JavaScript?

JavaScript is a programming language that runs in your browser. It lets you add interactivity to websites — from simple button clicks to complex web applications.

// This is a comment — ignored by JavaScript
console.log("Hello, World!");  // Prints to the browser console

Variables

Variables store data that you can use and change later:

// let — can be reassigned
let name = "Alice";
name = "Bob";  // ✅ works

// const — cannot be reassigned
const age = 25;
age = 26;  // ❌ error — cannot reassign a constant

// var — old way (avoid using it)
var city = "NYC";

Rule of thumb: Use const by default. Use let only when you need to reassign the variable. Don't use var.

Data Types

JavaScript has several primitive types:

// String — text
let greeting = "Hello";
let message = 'Single quotes work too';
let template = `Template literals can include ${greeting}`;

// Number — integers and decimals
let count = 42;
let price = 19.99;
let negative = -10;

// Boolean — true or false
let isActive = true;
let isComplete = false;

// Undefined — variable declared but not assigned
let notSet;
console.log(notSet);  // undefined

// Null — intentionally empty
let empty = null;

// Check the type
console.log(typeof greeting);  // "string"
console.log(typeof count);     // "number"
console.log(typeof isActive);  // "boolean"

Operators

Arithmetic Operators

let a = 10;
let b = 3;

console.log(a + b);  // 13 — addition
console.log(a - b);  // 7  — subtraction
console.log(a * b);  // 30 — multiplication
console.log(a / b);  // 3.333... — division
console.log(a % b);  // 1  — remainder (modulo)
console.log(a ** b); // 1000 — exponentiation (10^3)

// Increment and decrement
let x = 5;
x++;  // x is now 6
x--;  // x is now 5 again

Comparison Operators

console.log(5 == "5");   // true — loose equality (converts types)
console.log(5 === "5");  // false — strict equality (checks type too)

console.log(5 != "5");   // false — loose inequality
console.log(5 !== "5");  // true — strict inequality

console.log(10 > 5);   // true
console.log(10 < 5);   // false
console.log(10 >= 10); // true
console.log(5 <= 4);   // false

Always use === and !== — they're safer because they check both value and type.

Logical Operators

let isLoggedIn = true;
let isAdmin = false;

console.log(isLoggedIn && isAdmin);  // false — AND: both must be true
console.log(isLoggedIn || isAdmin);  // true — OR: at least one must be true
console.log(!isLoggedIn);            // false — NOT: inverts the value

String Operations

let first = "Hello";
let last = "World";

// Concatenation
let message = first + " " + last;  // "Hello World"

// Template literals (preferred)
let greeting = `${first} ${last}!`;  // "Hello World!"

// String methods
console.log(message.length);        // 11
console.log(message.toLowerCase()); // "hello world"
console.log(message.toUpperCase()); // "HELLO WORLD"
console.log(message.includes("World"));  // true
console.log(message.startsWith("Hello")); // true
console.log(message.replace("World", "There")); // "Hello There"

Type Coercion

JavaScript tries to convert types automatically (sometimes unexpectedly):

console.log("5" + 5);    // "55" — string concatenation
console.log("5" - 5);    // 0 — number subtraction
console.log("5" * "2");  // 10 — both converted to numbers
console.log(true + 1);   // 2 — true becomes 1
console.log(false + 1);  // 1 — false becomes 0

To avoid surprises, explicitly convert types:

// String to number
let str = "42";
let num = Number(str);      // 42
let parsed = parseInt(str); // 42

// Number to string
let count = 100;
let text = String(count);   // "100"
let concat = count + "";    // "100" (quick trick)

// To boolean
Boolean(1);        // true
Boolean(0);        // false
Boolean("hello");  // true
Boolean("");       // false

Conditionals

Make decisions in your code:

let age = 18;

if (age >= 18) {
  console.log("Adult");
} else if (age >= 13) {
  console.log("Teenager");
} else {
  console.log("Child");
}

// Ternary operator — shorthand for simple if/else
let status = age >= 18 ? "Adult" : "Minor";

Key Takeaways

• Use const by default, let when you need to reassign
• JavaScript has 6 primitive types: string, number, boolean, undefined, null, symbol
• Always use === for comparisons (strict equality)
• Template literals (`) are the modern way to build strings
• Be aware of type coercion — explicitly convert when needed