JavaScript Errors · Introduction, Silent Errors, Handling & the Error Object

let PI = Math.PI;         // PI = 3.141592653589793
PI = 99;                  // Attempt to reassign a read-only value

console.log(PI);
// Expected Output: 3.141592653589793

let score = 42;
score.bonus = 10;         // Numbers cannot have properties

console.log(score.bonus);
// Expected Output: undefined

delete Math.PI;           // Attempt to delete a core property

console.log(Math.PI);
// Expected Output: 3.141592653589793

function greet(name, name) {   // Two parameters with the same name!
  console.log(name);
}

greet("Amara", "Kofi");
// Expected Output: Kofi   (second value wins — first is silently overwritten)

function saveStudent() {
  studentName = "Amara";    // No let, const, or var!
}

saveStudent();
console.log(studentName);
// Expected Output: Amara

function applyInterest(account) {
  account.balance = account.Balance * 1.05;  // typo: "Balance" vs "balance"
}

let account = { balance: 1000 };
applyInterest(account);
console.log(account.balance); // 1000   ← unchanged — NaN was silently discarded

"use strict";              // Enable for the entire script

// Or inside a function only:
function strictFunction() {
  "use strict";
  // strict mode applies only inside here
}

"use strict";

// 1. Undeclared variable → now throws ReferenceError
function saveStudent() {
  studentName = "Amara";   // ❌ ReferenceError: studentName is not defined
}

// 2. Writing to a read-only property → now throws TypeError
let PI = Math.PI;
PI = 99;                   // ❌ TypeError: Assignment to constant variable

// 3. Duplicate parameter names → now throws SyntaxError
function greet(name, name) { // ❌ SyntaxError: Duplicate parameter name
  console.log(name);
}

// 4. Deleting an undeletable property → now throws TypeError
delete Math.PI;            // ❌ TypeError: Cannot delete property 'PI' of #<Object>

try {
  // Code that might go wrong
}

catch (error) {
  // Handle the error here
  // error.message tells you what went wrong
}

finally {
  // Always runs — error or no error
}

try {
  // Attempt something risky
} catch (error) {
  // Handle the error if it happens
} finally {
  // Always runs regardless
}

try {
  let result = null;
  console.log(result.toUpperCase()); // ❌ result is null — can't call method on null
} catch (error) {
  console.log("Something went wrong: " + error.message);
}

// Expected Output: Something went wrong: Cannot read properties of null (reading 'toUpperCase')

function loadData() {
  console.log("Loading started...");

  try {
    let data = JSON.parse("{ invalid json }");  // ❌ bad JSON
    console.log("Data loaded:", data);
  } catch (error) {
    console.log("Failed to parse data: " + error.message);
  } finally {
    console.log("Loading finished.");  // always runs
  }
}

loadData();

Loading started...
Failed to parse data: Unexpected token i in JSON at position 2
Loading finished.

// try with only finally (no catch) — error still propagates but finally runs
try {
  undeclaredVariable;
} finally {
  console.log("Cleanup ran.");   // runs before the error propagates
}
// Output: Cleanup ran.
// Then: ReferenceError: undeclaredVariable is not defined

throw expression;

throw new Error("Something went wrong");
throw new TypeError("Expected a number");
throw new RangeError("Value must be between 0 and 100");

function setAge(age) {
  if (typeof age !== "number") {
    throw new TypeError("Age must be a number. Got: " + typeof age);
  }
  if (age < 0 || age > 150) {
    throw new RangeError("Age must be between 0 and 150. Got: " + age);
  }
  console.log("Age set to: " + age);
}

try {
  setAge("twenty");
} catch (error) {
  console.log(error.name + ": " + error.message);
}

try {
  setAge(-5);
} catch (error) {
  console.log(error.name + ": " + error.message);
}

try {
  setAge(25);
} catch (error) {
  console.log(error.name + ": " + error.message);
}

TypeError: Age must be a number. Got: string
RangeError: Age must be between 0 and 150. Got: -5
Age set to: 25

function processInput(input) {
  try {
    if (typeof input !== "number") {
      throw new TypeError("Input must be a number");
    }
    return input * 2;
  } catch (error) {
    if (error instanceof TypeError) {
      console.log("Handled TypeError: " + error.message);
      return 0;  // provide a default
    }
    throw error;  // rethrow anything we didn't expect
  }
}

console.log(processInput("hello")); // Handled TypeError: Input must be a number → 0
console.log(processInput(5));       // 10

Handled TypeError: Input must be a number
0
10

// ❌ Bad — this hides the error completely
try {
  riskyOperation();
} catch (error) {
  // empty catch — the error disappears!
}

// ✅ Better — always log or handle meaningfully
try {
  riskyOperation();
} catch (error) {
  console.error("riskyOperation failed:", error.message);
}

try {
  null.toString();
} catch (error) {
  console.log("name:    " + error.name);
  console.log("message: " + error.message);
  console.log("stack:\n" + error.stack);
}

name:    TypeError
message: Cannot read properties of null (reading 'toString')
stack:
TypeError: Cannot read properties of null (reading 'toString')
    at <anonymous>:2:8
    at ...

function c() { null.toString(); }
function b() { c(); }
function a() { b(); }

try {
  a();
} catch (error) {
  console.log(error.stack);
}

TypeError: Cannot read properties of null (reading 'toString')
    at c (<anonymous>:1:14)   ← error happened here
    at b (<anonymous>:2:14)   ← b called c
    at a (<anonymous>:3:14)   ← a called b
    at <anonymous>:6:3        ← top-level called a

let myError = new Error("Something failed");
console.log(myError.name);    // "Error"
console.log(myError.message); // "Something failed"
console.log(typeof myError);  // "object"

let typeErr  = new TypeError("Expected a string");
let rangeErr = new RangeError("Value out of bounds");

// Array with negative length
try {
  let arr = new Array(-1);
} catch (e) {
  console.log(e.name + ": " + e.message);
  // RangeError: Invalid array length
}

// toFixed with invalid decimal count
try {
  let num = 3.14;
  num.toFixed(200);   // max allowed is 100
} catch (e) {
  console.log(e.name + ": " + e.message);
  // RangeError: toFixed() digits argument must be between 0 and 100
}

try {
  console.log(studentName);   // never declared
} catch (e) {
  console.log(e.name + ": " + e.message);
  // ReferenceError: studentName is not defined
}

"use strict";
try {
  undeclaredVar = 10;         // no let/const/var
} catch (e) {
  console.log(e.name + ": " + e.message);
  // ReferenceError: undeclaredVar is not defined
}

try {
  eval("let x = ;");   // invalid JavaScript syntax
} catch (e) {
  console.log(e.name + ": " + e.message);
  // SyntaxError: Unexpected token ';'
}

try {
  JSON.parse("{ name: Amara }");  // invalid JSON — keys must be quoted
} catch (e) {
  console.log(e.name + ": " + e.message);
  // SyntaxError: Unexpected token n in JSON at position 2
}

// Calling a non-function
try {
  let x = 42;
  x();             // 42 is not callable
} catch (e) {
  console.log(e.name + ": " + e.message);
  // TypeError: x is not a function
}

// Accessing property of null or undefined
try {
  let user = null;
  console.log(user.name);
} catch (e) {
  console.log(e.name + ": " + e.message);
  // TypeError: Cannot read properties of null (reading 'name')
}

// Wrong argument type
try {
  "use strict";
  Object.defineProperty({}, "x", { value: 1, writable: false });
  // Trying to write to it:
  let obj = {};
  Object.defineProperty(obj, "y", { value: 42, writable: false });
  obj.y = 99;      // TypeError in strict mode
} catch (e) {
  console.log(e.name + ": " + e.message);
}

try {
  decodeURIComponent("%");   // incomplete percent-encoding
} catch (e) {
  console.log(e.name + ": " + e.message);
  // URIError: URI malformed
}

let evalErr = new EvalError("eval is disabled here");
console.log(evalErr.name);    // "EvalError"
console.log(evalErr.message); // "eval is disabled here"

class ValidationError extends Error {
  constructor(message, field) {
    super(message);           // pass message to parent Error
    this.name = "ValidationError";
    this.field = field;       // add extra context
  }
}

class NetworkError extends Error {
  constructor(message, statusCode) {
    super(message);
    this.name = "NetworkError";
    this.statusCode = statusCode;
  }
}

function validateEmail(email) {
  if (typeof email !== "string") {
    throw new ValidationError("Email must be a string", "email");
  }
  if (!email.includes("@")) {
    throw new ValidationError("Email must contain @", "email");
  }
  return true;
}

try {
  validateEmail("amara-at-school.com");
} catch (error) {
  if (error instanceof ValidationError) {
    console.log("Validation failed on field: " + error.field);
    console.log("Reason: " + error.message);
  } else {
    throw error;   // rethrow unexpected errors
  }
}

Validation failed on field: email
Reason: Email must contain @

try {
  riskyOperation();
} catch (error) {
  if (error instanceof TypeError) {
    console.log("Type problem:", error.message);
  } else if (error instanceof RangeError) {
    console.log("Range problem:", error.message);
  } else if (error instanceof ValidationError) {
    console.log("Validation problem:", error.message);
  } else {
    console.log("Unknown error:", error);
    throw error;  // always rethrow what you can't handle
  }
}

function processPayment(amount, currency) {
  // Guard clauses — check inputs first
  if (typeof amount !== "number")   throw new TypeError("Amount must be a number");
  if (amount <= 0)                  throw new RangeError("Amount must be positive");
  if (typeof currency !== "string") throw new TypeError("Currency must be a string");
  if (currency.length !== 3)        throw new RangeError("Currency must be a 3-letter code");

  // Main logic — only reached if all guards pass
  console.log(`Processing ${currency} ${amount.toFixed(2)}`);
}

try {
  processPayment(100.50, "GHS");
  processPayment(-50, "USD");
} catch (error) {
  console.log(error.name + ": " + error.message);
}

Processing GHS 100.50
RangeError: Amount must be positive

// With async/await (preview — you'll learn this fully in async tutorials)
async function fetchStudent(id) {
  try {
    let response = await fetch("https://api.school.com/students/" + id);
    if (!response.ok) {
      throw new NetworkError("Student not found", response.status);
    }
    let data = await response.json();
    return data;
  } catch (error) {
    if (error instanceof NetworkError) {
      console.log("Network issue (" + error.statusCode + "): " + error.message);
    } else {
      console.log("Unexpected error: " + error.message);
    }
    return null;
  }
}

// ❌ Vague — useless in production
catch (error) {
  console.log("Error occurred");
}

// ✅ Informative — helps debugging
catch (error) {
  console.error(`[processPayment] Failed for amount=${amount}: ${error.name}: ${error.message}`);
  console.error(error.stack);
}

// ❌ Dangerous — catches everything, even programmer mistakes
try {
  doSomething();
} catch (error) {
  console.log("error happened");
  // doesn't rethrow — error disappears
}

// ✅ Selective — catch known errors, rethrow the rest
try {
  doSomething();
} catch (error) {
  if (error instanceof ValidationError) {
    showUserMessage(error.message);
  } else {
    throw error;  // programmer errors should propagate
  }
}