Clousure and Lexcical Scope

 Example 


function father(){
   let Property = "House"
     return function son(){
        let sonProperty = "Car"
        return `My owner ship in ${sonProperty} and ${Property}`
     }
}

const result = father();   // returns the 'son' function
console.log(result());




Closure

 A closure is created when an inner function (son) retains access to variables from its outer function (father) even after the outer function has finished executing.

In this case, son still has access to Property even though father() has already returned. That's a closure.

Lexcical 

Lexical Scope means a function's scope is determined by its position in the code (its location in the source file), and it has access to variables declared in its outer scopes.


Important 

Closure + Loop (Classic Interview Example)

for (var i = 0; i < 3; i++) {
  setTimeout(function () {
    console.log(i);
  }, 1000);
}
// Output: 3, 3, 3 (because of var + closure)
✅ Fix with Closure:

for (var i = 0; i < 3; i++) {
  (function (j) {
    setTimeout(function () {
      console.log(j);
    }, 1000);
  })(i);
}
// Output: 0, 1, 2





Comments

Post a Comment

Popular posts from this blog

Spread and Rest

Image
 Spread and Rest Spread and Rest boths are donated by (...)  three doted USES:  Both are use in arrya and object  SPREAD Spread  is use to expand the array and object. 1. Spread behave with array  As mentioned above, the ... syntax is used to expand values. In this case, arr1 is being expanded inside arr2 using the spread operator. 2. Spread behave with object Obj2 is expand so obj behave like as a spread operator  Rest  Rest Operator with array    1. The rest operator is used to combine multiple values into a single array. It’s especially useful when we don’t know how many arguments a function will receive. function sum(...numbers) {   return numbers.reduce((a, b) => a + b, 0); } sum(1, 2, 3);  Rest with Object const user = {   name: 'Sameer',   age: 25,   location: 'India',   profession: 'Developer' }; const { name, ...rest } = user;   
Read more

Shallow Copy and Deep Copy in JavaScript

Image
Shallow Copy in JavaScript When we use the spread operator ( ... ) or methods like Object.assign() or slice() to copy an object or array, it creates a shallow copy . This means only the top-level properties are copied, while nested objects or arrays are still referenced , not cloned. 🧪 Example with Array let a = [ 10 , 20 , [ 30 , 40 ]]; let b = [ ... a ]; // Shallow copy b [ 0 ] = 100 ; console . log ( a ); // [10, 20, [30, 40]] console . log ( b ); // [100, 20, [30, 40]] Here , b is a shallow copy of a . When we change b [ 0 ], it doesn ’ t affect the original . So far , so good . But now , let ’ s try changing the nested array b [ 2 ][ 0 ] = 300 ; console . log ( a ); // [10, 20, [300, 40]] console . log ( b ); // [100, 20, [300, 40]] Now both a and b are affected! That’s the problem with shallow copies — the nested values are shared by reference . Deep copy solves the problem of modifying nested arrays without affecting the original array. For ...
Read more
Image
   DOCKER Docker Engine Docker CLI - Command line interface Docker registry Docker Engine is an open-source containerization technology that allows developers to package applications into container Containers are standardized executable components combining application source code with the operating system (OS) libraries and dependencies required to run that code in any environment. 2. Docker CLI The command line interface lets you talk to the docker engine and lets you start/stop/list containers docker run -d -p 27017 : 27017 mongo \4 3. Docker registry The docker registry is how Docker makes money. It is similar to github , but it lets you push images rather than sourcecode Images vs containers Docker Image A Docker image is a lightweight, standalone, executable package that includes everything needed to run a piece of software, including the code, a runtime, libraries, environment variables, and config files. Docker Container A container is a running instance of an im...
Read more