The Three Kinds of Bugs

Bugs come in three main flavors, from easiest to hardest to catch:

1. Syntax errors: grammar mistakes

A syntax error means you broke JavaScript's grammar rules: a missing bracket, a missing quote, a typo in a keyword. JavaScript can't even understand your code, so nothing runs at all.

console.log("Hello there);

Uncaught SyntaxError: Invalid or unexpected token

These are the easiest bugs to fix, because JavaScript tells you about them straight away and usually points close to the problem. Your code editor will often underline them in red before you even run the code.

2. Runtime errors: crashes

A runtime error happens while the program is running. The grammar is fine, so the code starts running, but then it hits a line that's impossible to carry out, and it crashes.

const user = null;
console.log("Starting up...");
console.log(user.name);
console.log("This line never runs.");

Starting up...
Uncaught TypeError: Cannot read properties of null (reading 'name')

Notice that "Starting up..." did print. The program ran happily until it reached the bad line, then stopped. Runtime errors are medium difficulty: you get an error message, but you have to figure out why the value was wrong.

3. Logic errors: the sneaky ones

A logic error is when your code runs perfectly, with no errors at all, but gives the wrong answer.

function average(a, b) {
  return a + b / 2;
}

console.log(average(10, 20));

20

The average of 10 and 20 should be 15, not 20! But JavaScript doesn't know that. It just did what we told it (divide b by 2, then add a). No error message, no red text, no clue. Just a wrong answer quietly sitting there.

Logic errors are the hardest bugs to catch, because the computer can't help you. The only way to find them is to test your code and check that the answers make sense. (Did you spot the fix? It's parentheses: (a + b) / 2. Remember Grade 3's order of operations!)