SyntaxError vs ReferenceError vs TypeError in JavaScript

SyntaxError vs ReferenceError vs TypeError in JavaScript

JavaScript has several error types. The three most common are SyntaxError, ReferenceError, and TypeError. Knowing the difference helps you debug faster.

SyntaxError

Thrown during parsing, before any code runs. The entire script (or module) fails to load.

const x = ; // SyntaxError: Unexpected token ';'
let a = 1 let b = 2; // SyntaxError (missing semicolon or newline)
const y; // SyntaxError: Missing initializer in const declaration
let a = 1, let b = 2; // SyntaxError
``
`const` without an initializer is a `SyntaxError` because the engine catches it at parse time.

### `ReferenceError`

Thrown when a variable cannot be resolved. Two cases with `let`/`const`:

1. **Variable does not exist**:
```js
console.log(foo); // ReferenceError: foo is not defined
``
2. **TDZ access**:
```js
console.log(x); // ReferenceError: Cannot access 'x' before initialization
let x = 5;
``
### `TypeError`

Thrown when a value is not the expected type for an operation.

```js
const x = 5;
x = 10; // TypeError: Assignment to constant variable

const foo = undefined;
foo(); // TypeError: foo is not a function

const obj = null;
obj.name; // TypeError: Cannot read properties of null
``
Reassigning a `const` is a `TypeError` because the variable exists (no `ReferenceError`) but the operation (assignment) is not allowed for a `const`.

### Comparison Table

| Error | When | Example |
|---|---|---|
| `SyntaxError` | Malformed code, caught at parse time | `const x;` (no initializer) |
| `ReferenceError` | Variable does not exist or is in TDZ | `console.log(x); let x;` |
| `TypeError` | Value is wrong type for the operation | `const x = 5; x = 10;` |

### Let/Const Specific Cases

```js
const x;           // SyntaxError (missing initializer)
console.log(y); let y; // ReferenceError (TDZ)
const z = 5; z = 6;    // TypeError (reassigning const)
let a = 1; let a = 2;  // SyntaxError (re-declaration)
``
### The Takeaway

`SyntaxError` is parse-time (malformed code, `const` without initializer, re-declaration). `ReferenceError` is runtime (variable does not exist or is in TDZ). `TypeError` is runtime (value is wrong type, reassigning `const`). Knowing which one you got tells you where the bug is.