NEA - scope.md

Scopes Discussion

1. What is the scope of variable GLOBAL_DATA in the example below:

<script>
  let GLOBAL_DATA = { value : 1};
</script>

Pretend in the console, that we type: console.log(GLOBAL_DATA);

2. What is the scope of variable x in the examples below:

let x = 1;
{ 
  let x = 2;
}
console.log(x);
var x = 1;
{ 
  var x = 2;
}
console.log(x);

3. What is the scope of variable x in the examples below:

function outerFn(){
    let x = 1;
    function log(){
      console.log(x);
    };
    function run(fn){
      let x = 100;
      fn();
    }
    run(log);
};
outerFn();

4. What do we call this method of scoping:

let x0 = 0;
function fn1(){
  let x1 = 1;
  fn2();
  function fn2(){
    let x2 = 2;
    fn3();
    function fn3(){
      let x3 = 3;
      console.log(x0 + " " + x1 + " " + x2 + " " + x3);
    };
  };
};
fn1();

5. What is the difference between global scope and other scope types and when do we use the global scope?

6. What is the difference between let and var defining a variable?

7. What is the difference between strict mode and sloppy mode?

1. The scope of the variable GLOBAL_DATA is global. It is declared using the let keyword outside any function, making it accessible throughout the entire script. When you type console.log(GLOBAL_DATA) in the console, it will print the object { value: 1 }.

2. In both examples, the scope of variable x is different:

   a) In the first example with let x = 1; { let x = 2; } console.log(x);, the variable x inside the block is separate from the one declared outside the block. The output of console.log(x); will be 1, as it refers to the outer variable x with the value 1.

   b) In the second example with var x = 1; { var x = 2; } console.log(x);, the variable x inside the block reassigns the value of the outer x, as var has function scope (not block scope). The output of console.log(x); will be 2.

3. The scope of the variable x in this example is confined to the function outerFn. When the log function is called inside run, it will access the x from the outerFn scope and print 1.

4. This method of scoping, where variables are accessible through nested functions regardless of their level of nesting, is called "Lexical Scope" or "Static Scope." In lexical scoping, the scope of a variable is determined by its position in the source code's lexical hierarchy.

5. The main difference between the global scope and other scope types (such as function scope or block scope) is the accessibility of variables. Variables declared in the global scope are accessible from anywhere in the code, including inside functions and blocks. On the other hand, variables declared in local scopes (function or block scope) are only accessible within the respective function or block and not from outside.

   The global scope is used when you need a variable to have a global presence and be accessible across the entire codebase. However, it is generally considered best practice to limit the use of global variables to avoid potential conflicts and maintain a clear and modular code structure.

6. The main differences between let and var when defining variables are:

   • Scope: Variables declared with let have block scope, meaning they are limited to the block (or statement) in which they are declared. On the other hand, variables declared with var have function scope, making them accessible within the entire function they are declared in.

   • Hoisting: Variables declared with let are not hoisted to the top of their scope. They are in a "temporal dead zone" until the line where they are declared is reached. Variables declared with var, however, are hoisted to the top of their scope and can be accessed before their declaration.

   • Redeclaration: Variables declared with let cannot be redeclared within the same block or scope, whereas variables declared with var can be redeclared without any issues.

   Due to these differences, let is generally preferred over var in modern JavaScript code.

7. The difference between strict mode and sloppy mode pertains to how JavaScript code is executed:

   • Sloppy Mode (Non-strict mode): This is the default mode of JavaScript execution. In this mode, the JavaScript engine is more lenient and allows certain behaviors that can lead to errors or unexpected behavior. For example, undeclared variables can be implicitly created and assigned to the global object (window in browsers). This can lead to unintentional overwriting of global variables.

   • Strict Mode: When strict mode is enabled, certain behaviors that are considered error-prone or unsafe are prohibited. It is enabled by adding the "use strict"; pragma at the beginning of a script or a function. In strict mode:

     • Assigning values to undeclared variables results in a ReferenceError.
     • Deleting undeletable properties or variables results in a TypeError.
     • The use of reserved keywords for future JavaScript features is disallowed.

   Using strict mode is considered a best practice as it helps catch errors early, promotes safer coding practices, and allows the JavaScript engine to perform optimizations. It is recommended to use strict mode in all modern JavaScript code.