Please enable JavaScript.

Coggle requires JavaScript to display documents.

JS Scope, make your variable private, lexical scope, We discover the…

- - - - a game of Sorting marbles
        
        shadowing: same variable name in different scope
        
        all lexical scopes are determined at compiling time not at run time
        
        if we can't find a variable referenced in a scope we go up one level
        
        receiving and retrieving data from a variable is known at compiling time and actually used at run time(or execution time done by the JS engine)
        
        compiling is a plan to reserve memory and use other resources
        
        Buckets are unites of scope: functions and blocks
        
        Identifiers are the marbles
        
        sorting colored marbles in the right colored bucket
      - Bucket
        
        Functions and {Blocks}
        
        unite of scope
    - - target
        
        receiving data
        
        :arrow_left: LHS
      - source
        
        retrieving data from
        
        :arrow_right: RHS
      - Role
  - - - Compiler:
      - 1- No, but here I'll "conceptually" create one (red marble) for you, poook!
        
        Global scope Manager:
        
        actual creation in runtime
        
        3- Hey global scope (red bucket), I have another formal declaration (red marble), this time it's a function declaration "double", ever heard of this identifier?
        
        Compiler:
        
        3- No, but here I'll "conceptually" create one (red marble) for you, poook!
        
        Global scope Manager:
        
        3- ... Oh, that's a special identifier -functions- they make new scopes(buckets)
        
        Compiler:
        
        3- Hey global scope manager, we need a new scope (bucket)
        
        3- Sure, here is your function "double" scope (Blue Bucket), pooogh!
        
        3 more items...
    - - when we figure up all the scope, all the bucket and the marbles...
  - - - VM:
      - 1- Yes!
        
        Global scope Manager:
        
        formally declared in compile time
        
        then the number 10 is put in the red marble "x"
        
        line 3 to 6 and 8 to 11 are declarations
        
        they are not there anymore from the perspective of the second pass
        
        13- Hey global scope (red bucket), I have a source reference for a function called "double" (red marble), ever heard of it?
        
        3- Yes!
        
        2 more items...
        
        VM:
    - - We use all that info from the processing stage to execute the code
    - - pollute the Global Scope
      - to AVOID
        
        or 'use strict' mode
      - created in run time
      - always create your variables, don't auto-create them
      - Any undeclared variable (in sloppy mode ≠ strict mode) at any scope end up auto-created in the global scope
  - - - An identifier is a sequence of characters in the code that identifies a variable, function, or property.
  - - - compiling Phases
        
        determine the scope of variables
      - execution Phases
      - Prof: syntax errors, early errors, and hoisting.
        
        Cheating: Runtime Scope Modifications: eval(..) and with.
        
        "Reference Error: XYZ is not defined."
        
        "Not defined"
        
        "not declared"
        
        NOT "undefined,"
        
        undeclared variable
        
        typeof(v)
        
        not declared
        
        undefined
        
        :!?:
        
        declared but not initialized
        
        undefined
  - - - Anonymous function expression
        
        var f1 = function() { //*** }
        
        arrow function
        
        var af = () => { //*** }
        
        still anonymous
        
        "I don't recommend using them as a general replacement for any function" K.S
      - Named function expression
        
        var f2 = function f2() { //*** }
        
        "You should prefer this one over the anonymous 100%, zero exceptions!!" K.S
        
        1- Reliable self-reference(recursion, etc)
        
        2- More debuggable stack traces
        
        3- *More self-documenting code
- - - - JS engine doesn't move things around, as suggested with the word!!!
    - - b/c assignments are a runtime thing
    - - the TDZ was initially designed for const to prevent it from having two different assignment (undefined and whatever else like var), then extended to let
      - Always put your let and const to the top of your block to prevent a TDZ
      - let doesn't hoist
        
        Let and Const Declarations specs 13.3.1
        
        FALSE
- - - - group a set of related functions together, without data
    - - bundle data and stateful functions together with no POLE
      - data-and-functionality aspect of encapsulation, but not the visibility-control aspect.
    - - not only we need grouping and state, but also access control through visibility (private vs. public).
      - "classic module,"
        
        "revealing module"
    - - module.exports.getName = getName;
      - Object.assign(module.exports,{
        
        // .. exports ..
        
        });
      - NOT
        
        // defining a new object for the API
        
        module.exports = {
        
        // ..exports..
        
        };
    - - export { getName };
      - export function getName(studentID) { //.. }
      - export default function getName(studentID) {
- - - - now, every language has closure, b/c it's that important!!!
  - - - Preserving access to variables not capturing a value
        
        Live Link, Not a Snapshot
      - you don't close over value, you close over a variables
        
        you have a linckage to that variable,
        
        At the time you access it, you'r seeing whatever variable has at that moment.
- - - - night-light in kids bedrooms
  - - - and use MAGIC_NUBER rather than 7
    - - to give a semantic meaning and avoid writing the full url each time