03-variables.ts

// ============================================
// 03. Variables and Type Annotations
// ============================================

console.log("=== VARIABLE DECLARATIONS ===\n");

// let - can be reassigned
let count: number = 0;
count = 10; // OK
console.log(`let - can be reassigned: count = ${count}`);

let userName: string;
userName = "Alice"; // OK
console.log(`let - can be declared without initial value: userName = ${userName}`);

// const - cannot be reassigned
const PI: number = 3.14159;
// PI = 3.14; // Error: Cannot assign to 'PI'
console.log(`const - cannot be reassigned: PI = ${PI}`);

const user = {
  name: "Alice",
  age: 25
};
user.age = 26; // OK - object properties can change
console.log(`const object - properties can change: user.age = ${user.age}`);

// Type Inference
console.log("\n=== TYPE INFERENCE ===\n");

let age = 25; // TypeScript knows this is number
let name = "Alice"; // TypeScript knows this is string
let isActive = true; // TypeScript knows this is boolean

console.log("TypeScript automatically infers types:");
console.log(`  age = 25 → ${typeof age}`);
console.log(`  name = "Alice" → ${typeof name}`);
console.log(`  isActive = true → ${typeof isActive}`);

// Explicit Type Annotations
console.log("\n=== EXPLICIT TYPE ANNOTATIONS ===\n");

let userAge: number = 25;
let userName2: string = "Alice";
let isActive2: boolean = true;

console.log("Explicit type annotations:");
console.log(`  userAge: number = ${userAge}`);
console.log(`  userName2: string = ${userName2}`);
console.log(`  isActive2: boolean = ${isActive2}`);

// Variables without initial values
let username: string;
username = "alice"; // Later assignment
console.log(`\nVariable declared without initial value: username = ${username}`);

// Multiple Declarations
console.log("\n=== MULTIPLE DECLARATIONS ===\n");

let x: number, y: number, z: number;
x = 1;
y = 2;
z = 3;
console.log(`Multiple declarations: x=${x}, y=${y}, z=${z}`);

// Or initialize them
let a: number = 1, b: number = 2, c: number = 3;
console.log(`Multiple declarations with initialization: a=${a}, b=${b}, c=${c}`);

// Readonly Modifier
console.log("\n=== READONLY MODIFIER ===\n");

interface Point {
  readonly x: number;
  readonly y: number;
}

let point: Point = { x: 10, y: 20 };
// point.x = 30; // Error: Cannot assign to 'x' because it is a read-only property
console.log(`Readonly properties: point = { x: ${point.x}, y: ${point.y} }`);
console.log("  Note: point.x and point.y cannot be reassigned");

// Type Assertions
console.log("\n=== TYPE ASSERTIONS ===\n");

let value: any = "hello";
let strLength: number = (value as string).length;
console.log(`Type assertion: value as string → length = ${strLength}`);

// Non-null Assertion Operator
console.log("\n=== NON-NULL ASSERTION ===\n");

// Note: DOM types (HTMLElement, document) are for browser environments
// In Node.js, we'll use a mock example instead
function getElement(id: string): string | null {
  // In a real browser environment, this would be:
  // return document.getElementById(id);
  // For Node.js demo, we'll return a mock value
  return id ? `element-${id}` : null;
}

let element = getElement("myDiv")!; // Non-null assertion
console.log(`Non-null assertion: element = ${element}`);
console.log("  The '!' operator tells TypeScript we're certain it's not null");

console.log("\n=== DEMO COMPLETE ===");

export { count, PI, user, point, strLength };