Hoisting in JavaScript
Definition: JavaScript moves variable and function declarations to the top of their scope during compilation — this is called hoisting.
|
1 2 3 4 5 6 7 |
console.log(x); // undefined var x = 5; sayHi(); // works function sayHi() { console.log('Hello'); } |
Note: Variables declared with let and const are not accessible before initialization (Temporal Dead Zone).
Var, Let, and Const
Summary: These keywords define variables, but differ in scope and re-assignment rules.
var— function-scoped, can be re-declared.let— block-scoped, can be reassigned but not re-declared.const— block-scoped and cannot be reassigned.
Temporal Dead Zone (TDZ)
The period between variable creation and initialization when it can’t be accessed. Accessing a let or const variable before initialization throws a ReferenceError.
Lexical Scope
Definition: A function can access variables defined in its outer scope. JavaScript uses lexical scoping based on where functions are written, not where they are called.
Higher-Order Functions
Functions that take other functions as arguments or return them as results.
|
1 2 3 4 5 6 7 |
function greet(name) { return () => console.log(`Hello, ${name}`); } const hi = greet('Shubham'); hi(); // Hello, Shubham |
Shallow Copy vs Deep Copy
Shallow copy copies only references to nested objects, while deep copy creates new independent copies.
|
1 2 3 4 5 |
const obj1 = { a: { b: 1 } }; const shallow = { ...obj1 }; const deep = structuredClone(obj1); |
Types of Functions
Function Declaration
|
1 2 3 |
function greet() { console.log("Hello"); } |
Function Expression
|
1 2 3 4 |
const foo = function() { console.log("foobar"); }; foo(); // foobar |
Anonymous Function
A function without a name, often used as a callback.
Named Function Expression
Useful for recursion or debugging.
Arrow Functions
Shorter syntax and lexical this binding.
|
1 2 3 |
const add = (a, b) => a + b; |
Currying
Transforms a function with multiple arguments into nested single-argument functions.
|
1 2 3 4 5 6 |
function sum(a) { return b => c => a + b + c; } console.log(sum(1)(2)(3)); // 6 |
Template Literals
Allow embedded expressions using backticks (`).
|
1 2 3 4 |
const name = "DevPoint"; console.log(`Welcome to ${name}!`); |
Closure
A closure is a function bundled with its lexical environment — it remembers variables from its outer scope even after the outer function has finished.
|
1 2 3 4 5 6 7 8 9 10 11 12 |
function makeCounter() { let count = 0; return function() { count++; return count; }; } const counter = makeCounter(); console.log(counter()); // 1 console.log(counter()); // 2 |
Spread Syntax & Destructuring
Spread: Expands elements of an array or object.
|
1 2 3 4 |
const arr = [1, 2]; const newArr = [...arr, 3]; |
Destructuring: Extracts values into variables.
|
1 2 3 |
const {name, age} = {name: 'Shubham', age: 25}; |
Map vs forEach / Find vs Filter
map()returns a new array.forEach()executes for side effects, returns undefined.find()returns the first match.filter()returns all matches.
Exception Handling
Use try...catch to handle runtime errors gracefully.
|
1 2 3 4 5 6 7 |
try { riskyCode(); } catch (error) { console.error("Something went wrong:", error); } |
Event Loop
The Event Loop handles asynchronous callbacks, ensuring non-blocking execution.
Promises, Async & Await
Used for asynchronous code flow control.
|
1 2 3 4 5 6 |
async function fetchData() { const data = await fetch('/api'); console.log(await data.json()); } |
TypeScript
A superset of JavaScript adding static types, interfaces, and tooling support for safer, scalable code.
Object-Oriented Programming (OOP)
Organizes code into objects with properties and methods. JavaScript supports classes and prototypes.
Threads in JavaScript
- Execution Thread: The main thread runs all JS code.
- Worker Thread: Runs scripts in background without blocking the main thread.
- Cluster: A group of worker processes that share load across CPU cores.
Written by Shubham Sharma — last updated Oct 2025. Visit newdevpoint.in for more tutorials.