The sea is wide by diving, the sky is high as birds fly. Hey how are you! I’m Molly

Review the old and learn the new, can be a teacher. Rereading the little Red Book (fourth edition) series of articles is intended to rearrange THE JS knowledge points, check the omissions and make up the deficiencies, and build their own front-end knowledge system. The series will organize and publish articles from the little Red Book chapters based on their own understanding. Welcome to join us, let’s reread the Little Red Book and learn the new.

variable

Variables in JavaScript are loosely typed, and a variable can be understood as a name that specifies a particular value at a particular point in time

Variables contain two different types of data: raw values and reference values

The original values contain Undefined, Null, Boolean, Number, String, Bigint, and Symbol, and the reference values contain Object.

The original value

  • According to the value of access
  • Assignment is equivalent to being copied to the location of a new variable, and the two variables can be used independently of each other
  • Arguments passed to a function are copied inside the function to a local variable

Reference value

  • Access by reference
  • There is the concept of dynamic properties, which means we can add, modify, and delete properties and methods at any time
  • Assignment copies the object reference (pointer) to the location of a new variable. Both variables point to the same memory address. When an attribute operation is performed on one object, the other object is affected
  • In the case of function parameter passing, a copy of the reference is made inside the function, and changes to the parameter variables inside the function are reflected outside the function

Execution context (context for short)

The context of variables or functions determines what data they can access and how they behave. Each context has a variable object associated with it, and all variables and functions defined within that context are stored on that object. Although this variable object is not directly accessible through code, we can view it in the console via the break point.

  function foo() {
    let num = 0;
    return function () {
      return num++;
    };
  }
  let add = foo();
  add();
Copy the code

The [[Scopes]] shown here is the variable object that stores the context

Context can be divided into global context and local context. The global context is destroyed before the program exits (for example, closing the web page or exiting the browser), and the local context is destroyed after the execution of its code.

Each function call has its own context. When the function is executed, the context of the function will be pushed onto a context execution stack. After the function is executed, the context execution stack will pop up the context of the function, returning control to the previous execution context.

When the script executes, a Global context is pushed to the bottom of all context execution stacks, which is the Global property shown in the screenshot above

When the code in the context executes, it creates a chain of scopes for the variable object. This chain of scopes determines the order in which the code at each level of context accesses variables and functions. The scope is the containment relation, and the global contains the local.

A small summary

Context relates variable objects to determine which data functions can access, while scope determines the rules for data access.

Simply put, the access rules for scopes can be summed up as follows: look-in access, inside access to the outside and outside access to the inside, which can be called the scope chain

Function parameters are considered variables in the current context and therefore follow the same access rules as other variables below.

Thank you

Welcome to pay attention to my personal public number front end of the cat every day to push you fresh quality good article. Reply “benefits” and you will get my carefully prepared front-end knowledge gift package. May you go all the way with light in your eyes!

Welcome to reread the Little Red Book with us. Wechat: Molly