{
    "slug": "js_undefined_vs_null",
    "term": "undefined vs null — Subtle Differences",
    "category": "javascript",
    "difficulty": "beginner",
    "short": "undefined means 'not yet assigned' (declared but empty); null means 'intentionally absent' — they're different values but both falsy, and typeof null === 'object' is a famous JS bug.",
    "long": "undefined: default value of unassigned variables, missing object properties, missing function parameters, void function return. null: explicit absence, intentional empty value. Key differences: typeof undefined === 'undefined', typeof null === 'object' (JS bug from 1995, can't fix). null == undefined (true), null === undefined (false). JSON.stringify converts undefined to nothing, null to 'null'. Optional chaining: obj?.prop returns undefined for missing, not null. Best practice: use null for intentional absence, never assign undefined explicitly.",
    "aliases": [],
    "tags": [
        "javascript",
        "null",
        "undefined",
        "types"
    ],
    "misconception": "null and undefined are interchangeable — they're different values. null == undefined (loose) but null !== undefined (strict). JSON treats them differently.",
    "why_it_matters": "Confusing null and undefined causes subtle bugs in comparisons and JSON serialisation — especially in API contracts where null means 'explicitly empty' vs missing field.",
    "common_mistakes": [
        "Assigning undefined explicitly — use null for intentional absence.",
        "Using == instead of === which treats null and undefined as equal.",
        "Forgetting that JSON.stringify drops undefined values but preserves null."
    ],
    "when_to_use": [],
    "avoid_when": [],
    "related": [
        "js_typeof_checks",
        "js_reference_errors",
        "js_nullish_coalescing",
        "type_coercion"
    ],
    "prerequisites": [
        "js_typeof_checks"
    ],
    "refs": [
        "https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/null"
    ],
    "bad_code": "// Both are falsy but behave differently:\nconst a = null;\nconst b = undefined;\nconsole.log(a == b);   // true\nconsole.log(a === b);  // false\nconsole.log(JSON.stringify({a, b})); // {\"a\":null}  (b dropped!)",
    "good_code": "// Explicit null for intentional absence:\nconst user = fetchUser() ?? null; // null if not found\n\n// Strict null checks:\nif (value === null) { /* intentionally empty */ }\nif (value === undefined) { /* not yet set */ }\nif (value == null) { /* either null or undefined */ }\n\n// TypeScript helps:\nfunction getUser(id: string): User | null { }",
    "quick_fix": "Use null for intentional absence, never assign undefined explicitly. Use === for comparisons. Use ?? (nullish coalescing) to handle both. Use TypeScript strict null checks.",
    "severity": "low",
    "effort": "low",
    "created": "2026-03-22",
    "updated": "2026-04-05",
    "citation": {
        "canonical_url": "https://codeclaritylab.com/glossary/js_undefined_vs_null",
        "html_url": "https://codeclaritylab.com/glossary/js_undefined_vs_null",
        "json_url": "https://codeclaritylab.com/glossary/js_undefined_vs_null.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": "[undefined vs null — Subtle Differences](https://codeclaritylab.com/glossary/js_undefined_vs_null) (CodeClarityLab)",
                "footer_credit": "Source: CodeClarityLab Glossary — https://codeclaritylab.com/glossary/js_undefined_vs_null"
            }
        }
    }
}