{ “chapterTitle”: “Hoisting in JavaScript”, “sections”: [ { “name”: “Introduction”, “content”: “Hoisting is a behavior in JavaScript where variable and function declarations are moved to the top of their containing scope during the compilation phase. Understanding hoisting is crucial for JavaScript developers to avoid unexpected behaviors in their code.” }, { “name”: “Section 1”, “concept”: “Hoisting of Variables”, “explanation”: “In JavaScript, variable declarations (not initializations) are hoisted to the top of their scope. This means that regardless of where a variable is declared within a function or block, it is moved to the top of its scope during compilation.”, “example”: “var x; // Declaration is hoisted\nconsole.log(x); // Output: undefined\nx = 5; // Initialization”, “codePractice”: { “title”: “Code Practice”, “description”: “Write a code snippet that demonstrates hoisting of variables.”, “codeHint”: “// Declare and initialize a variable\nvar y = 10;\n\n// Log the value of the variable\nconsole.log(y);” } }, { “name”: “Section 2”, “concept”: “Hoisting of Functions”, “explanation”: “Function declarations are also hoisted in JavaScript. This means that regardless of where a function is declared within a scope, it is moved to the top of its containing scope during compilation.”, “example”: “hoistedFunction(); // Function call before declaration\n\nfunction hoistedFunction() {\n console.log(‘Function hoisted!’);\n}”, “codePractice”: { “title”: “Code Practice”, “description”: “Write a function declaration and call it before the declaration to observe hoisting behavior.”, “codeHint”: “// Declare a function\nfunction myFunction() {\n console.log(‘Hoisted function’);\n}\n\n// Call the function before its declaration\nmyFunction();” } }, { “name”: “Live Code Practice”, “content”: “This is the live code practice section, where users can write and run their own code to experiment with hoisting concepts.” }, { “name”: “Summary”, “content”: “Understanding hoisting in JavaScript is essential for writing predictable and maintainable code. Remember that while hoisting moves declarations to the top, it doesn’t move initializations or assignments.” } ] }