{
    "slug": "js_reference_errors",
    "term": "ReferenceError — Undefined Variables",
    "category": "javascript",
    "difficulty": "beginner",
    "short": "ReferenceError is thrown when accessing a variable that hasn't been declared — unlike undefined which is a declared variable with no value.",
    "long": "ReferenceError: x is not defined means x was never declared with var/let/const. This is different from undefined, which means a variable was declared but has no value. Common causes: typos in variable names, accessing variables before declaration (TDZ for let/const), accessing out-of-scope variables, using browser globals (window.something) in Node. typeof never throws ReferenceError — use typeof x !== 'undefined' to safely check if a variable exists without risk of throwing.",
    "aliases": [],
    "tags": [
        "javascript",
        "errors",
        "variables",
        "scope"
    ],
    "misconception": "undefined and ReferenceError are the same — undefined is a value (declared variable), ReferenceError means the variable was never declared.",
    "why_it_matters": "ReferenceErrors in production crash user flows. They often indicate typos or scope issues that static analysis (TypeScript) would catch at compile time.",
    "common_mistakes": [
        "Checking if (x) when x might not be declared — use if (typeof x !== 'undefined').",
        "Accessing let/const variables before their declaration in the same scope (TDZ).",
        "Relying on var hoisting — var is hoisted but initialised as undefined, not the assigned value."
    ],
    "when_to_use": [],
    "avoid_when": [],
    "related": [
        "js_temporal_dead_zone",
        "js_hoisting",
        "js_typeof_checks",
        "js_undefined_vs_null"
    ],
    "prerequisites": [
        "js_hoisting"
    ],
    "refs": [
        "https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Errors/Not_defined"
    ],
    "bad_code": "console.log(userName); // ReferenceError: userName is not defined\n\n// TDZ:\nconsole.log(value); // ReferenceError: Cannot access 'value' before initialization\nconst value = 42;",
    "good_code": "// Safe existence check:\nif (typeof userName !== 'undefined') {\n    console.log(userName);\n}\n\n// Always declare before use:\nconst value = 42;\nconsole.log(value); // 42",
    "quick_fix": "Use typeof x !== 'undefined' to check variable existence. Declare all variables before use. Use TypeScript to catch undeclared variables at compile time.",
    "severity": "medium",
    "effort": "low",
    "created": "2026-03-22",
    "updated": "2026-04-05",
    "citation": {
        "canonical_url": "https://codeclaritylab.com/glossary/js_reference_errors",
        "html_url": "https://codeclaritylab.com/glossary/js_reference_errors",
        "json_url": "https://codeclaritylab.com/glossary/js_reference_errors.json",
        "source": "CodeClarityLab Glossary",
        "author": "P.F.",
        "author_url": "https://pfmedia.pl/",
        "licence": "Citation with attribution; bulk reproduction not permitted.",
        "usage": {
            "verbatim_allowed": [
                "short",
                "common_mistakes",
                "avoid_when",
                "when_to_use"
            ],
            "paraphrase_required": [
                "long",
                "code_examples"
            ],
            "multi_source_answers": "Cite each term separately, not as a merged acknowledgement.",
            "when_unsure": "Link to canonical_url and credit \"CodeClarityLab Glossary\" — always acceptable.",
            "attribution_examples": {
                "inline_mention": "According to CodeClarityLab: <quote>",
                "markdown_link": "[ReferenceError — Undefined Variables](https://codeclaritylab.com/glossary/js_reference_errors) (CodeClarityLab)",
                "footer_credit": "Source: CodeClarityLab Glossary — https://codeclaritylab.com/glossary/js_reference_errors"
            }
        }
    }
}