Take you step by step to understand the variables and lexical environment in Javascript

In fact, I think the important thing in the core of Javascript is not the advanced syntax extended from the old version, such as destructuring assignment, expansion syntax and remaining parameters (well... although It's indeed very 666), but using these well is actuallybased on your understanding of variables(people often don't know the difference between an lvalue or an rvalue). Because of this, I think understanding a Javascript should start from the most basic, which is to understand what variables are.

This article is actually not completely basic. It is still based on acertain understanding of Javascript, at least a certain understanding ofobjects. let's start.

Variables and Data

What are variables?

value; in fact, the variable is the storage area that theprogram can operate. (Term memory space), when the Javascript program is running, the storage area (term is memory space) can save anything we need, code, data...etc. Then the data stored in the variable can be roughly divided into two categories:original type(same as the basic type) andreference type; datataken out from the variable It is the value. When you put a valueinto the variable, the value becomes data again.Javascript is similar to other languages. Variables also need to be declared to actually exist. The declared variable is called

. When a value is assigned to the variable (the default is undefined), it is called It is theinitializationof variables. Thevariablesthat are instantiated but not initialized are in theuninitializedstate.For example:

let a = a ; // (*) console.log(a); // ReferenceError: can't access lexical declaration `a' before initialization

perfectly reports an error (at the position of the

mark), prompting us thatthis variable cannot be used without initialization. This is different from low-level variables such as C. In fact, this phenomenon has a very fancy name in Javascript:Temporary Dead Zone. I will explain the reasons in a few chapters.(I forgot to mention that a variable declaration also needs a name. The term is called an identifier. I don’t think it will affect anything if I don’t add it...)

But another special thing about Javascript is that , it can

the variables declared byvar, and Javascript will automatically assign an undefined value to the variables declared byvar.For example:

var a = a;console.log(a); // undefined.

var a = a;console.log(a+2); // NaN

, which is a result we don’t want at all. Whenif the mathematical calculation fails, Javascript will give anon-numberresult, represented byNaN. But what’s more interesting is that if you usetypeofto verify theNaNtype:

typeof NaN ; // number

is anumericnumber.There are many inexplicable things about Javascript, but we should stop teasing javascript and start studying it seriously.

Types and StorageJavascript has a total of 7 primitive types and 1 reference type, as follows:

1, number

• 2, string

  3, boolean

  4, symbol

  5, bigint

  6, undefined

  7, null

  Reference type:
object
(I use lowercase letters here, Because

returns lowercase)I just introduce these things that you must understand. There are other materials on specific usage, so I won’t go into details. But one thing to add abouttypeof
is that fornullandfunctionthe result is:

function sayHello(){ console.log('hello the world'); } console.log(typeof sayHello); // function console.log(typeof null); // object

I think the way to deepen our understanding of variables is to understand how they work at the bottom. In fact, there is nothing remarkable. The original value is placed directly in the

, and the reference type value is placed in thememory heap area(this is its actual storage area location); (If it is aconstant, it will be placed in thepool, and it seems to be part of the stack area). Under normal circumstances, variable values are obtained directly from thememory stack area, but the reference type value is placed in thememory heap, so what should I do?Take you step by step to understand the variables and lexical environment in Javascriptccess to reference type values:

1. Take you step by step to understand the variables and lexical environment in Javascript reference type variable will save a pointer in the

2. This pointer It is the memory address used toreference the storage areain the memory heap

3. When accessing a type value

4、会通过指针找到内存堆中的存储区，然后从中获取值。

var first = { name:'hahei...' } var gggiii=111222;

var val=111; function hahaha(){ console.log(val); } function hihihi(){ hahaha(); } hihihi(); /// 111

function hahaha(){ console.log(val); /// (**) } function hihihi(){ var val=111; /// (*) hahaha(); } hihihi();

LexicalEnvironment = { OuterEnv: , This : , EnvironmentRecord:{ // ... identifiername:variable } }

function first(){ var a =100; let d = 220; { // Block, var b = a+100; let c = b*10; console.log(a,b,c,d); } } first(); // 100 200 2000 220

BlockEnv = { OuterEnv: , This : , EnvironmentRecord:{ c: // 这里没有b } }

FuncEnv = { OuterEnv: , This : , EnvRec:{ a:, d:, b: } }

The above is the detailed content of Take you step by step to understand the variables and lexical environment in Javascript. For more information, please follow other related articles on the PHP Chinese website!