A few small ambushes in JavaScript variables that you don't know!

Even the front-end great god will sometimes be beaten to the ground by some small ambushes, and immediate prevention is the kingly way. Today Xiaoqian will introduce you to a few small ambushes in JS variable settings, and take good care of your small books.
Variables declared with the var keyword are explicitly declared variables: such as: var abc1 ='hello'
js allows declaring variables without var, that is, implicitly declared variables: such as: abc2 ='world'
Then, the problem is here, these two Are there any differences in variables?
1. If both abc1 and abc2 are in the global scope, print the window object in the browser console: console.log (window)
as shown in the figure above:
A few small ambushes in JavaScript variables that you don't know!
you can see in the figure above: the global variables abc1 and abc2 are the properties of the window object. Both have a global scope.
2. If both abc1 and abc2 are in the function scope, print the window object on the browser console?
A few small ambushes in JavaScript variables that you don't know!
As shown in the figure below: In the
A few small ambushes in JavaScript variables that you don't know!
above figure, you can see: in the function scope, abc1 will not appear in the window object, it is a local variable; and abc2 is still a property of the window object and has a global scope.
3. If both abc1 and abc2 are in the global scope and are attributes of the window object, can they be deleted like object attributes?
A few small ambushes in JavaScript variables that you don't know!
As shown in the figure below:
A few small ambushes in JavaScript variables that you don't know!
As you can see in the figure above: the variable abc1 declared with var has not been deleted, it is still the property of the window object; the variable abc2 declared without var has been deleted.
Why is there such a difference?
This is related to the default object attribute descriptor!
A few small ambushes in JavaScript variables that you don't know!
As shown in the figure below: In
A few small ambushes in JavaScript variables that you don't know!
the figure above, you can see: In the descriptor of the attribute abc1 of the window object, configurable: false means that the attribute cannot be configured or deleted.
A few small ambushes in JavaScript variables that you don't know!
As shown in the figure below: In the
A few small ambushes in JavaScript variables that you don't know!
above figure, you can see: In the descriptor of the attribute abc2 of the window object, configurable: true means that the attribute is configurable and can be deleted.
It is the default setting in the object attribute descriptor that is different, which leads to the difference whether it can be deleted!
Variable declarations and function declarations in js will have "declaration promotion". When the js engine parses and executes the code, it is divided into two stages: 1. Pre-analysis stage; 2. Line-by-line execution stage.
In the pre-analysis stage, the variable abc1 is declared and assigned the initial value undefined; in the line-by-line execution stage, the variable abc1 is assigned the value'hello'; therefore, printing before the variable declaration will not report an error, and the printed value is undefined.

Guess you like

Origin blog.51cto.com/15128702/2661628