scenario

Look at the output of the code below:

Var a = 0 console.log(" first output a: ", a) if (true) {a = 1 console.log(" second output a: ") ",a) function a() {} a = 2 console.log(" ",a)} console.log("Copy the code

Results:

Output A: 0 for the first time a: 1 for the second time A: 2 for the third time A: 2 for the fourth time A: 1Copy the code

As you can see, the first three outputs are 0, 1, and 2 based on our assignment, but the fourth output is 1 instead of 2.

explain

  1. Function a() {} = function a() {} = function a() {} = function a() {}

  2. When the code reaches the line defined by function a() {}, because JS dictates that the function declaration in the block-level scope is promoted to the top of its scope, which is outside the if block, it synchronizes the value of the inner function A to the outer function A.

(JavaScript you don’t know)

If there is an “A” outside the if block and an “A” inside the if block, there are two “A’s” inside the if block.

Var a = 0 // external a console.log ", a) // Output external a if (true) {// js implicitly put the definition of function a in here, now there is an internal a a = 1 // change the internal a from the function to 1 console.log(" the second output a: Function a() {} function a() {} function a() {} function a() {} Log (" third output a: ",a) // outputs internal A, that is,a} console.log(" fourth output a: ",a) // outputs external A, because of the declaration synchronization in the if block, the external A is synchronized from 0 to 1Copy the code

It can be seen that the external A is modified because of the declaration of fucntion A, and the internal A is modified in the other parts of the IF block. It is enough to make this distinction. Although we can see only one A variable from the naked eye, there are actually two variables when it runs.

validation

  1. You can see this when debug is executed in the if blockblockFunction a has been elevated to the top of the block:

  1. When performing thea = 1The external a is still 0function aHas becomea=1, this indicates that the internal function a has been modified:

  1. When performing thefunction a() {}This line of code has been declared with the outer a changed to 1, which indicates that the declaration promotion exists. It does promote the inner A declaration to the outer place, which already has a, so it directly assigns the inner A value to the outer A:

  1. Performed againa = 2, we can see that the internal A is also modified, the internal A is modified, and the external A is not affected:

  1. When the last time a is printed, the block has been destroyed and the scope is outside again, so the output is outer A, and outer A has been changed to 1 before that, so the output is 1

doubt

Function a(){} = function a(){} = function a(){} = function a(){} = function A (){}

They’re not exactly the same, outer A and inner A because they’re in different scopes, and their declarations are in different existence addresses,

If a = 2, the value of the internal memory address of the variable a is not synchronized to the value of the external memory address of the variable A, unless the external and internal a refer to the same object, and the value of the reference object that both refer to is changed in the if block:

Var a = 0 console.log(" first output a: ", a) if (true) {a = {name: 'I am a reference object ', desc:' at this point I am assigned to internal a'} console.log(" second output a: ",a) function a() {} a.desc = 'I changed desc in if block' console.log(" third time output a: ",a)} console.log(" fourth time output a: ",a)Copy the code

The output

The first output a: 0 the second output a: {name: 'I am a reference object ', desc:' now I am assigned to internal a'} the third output a: {name: 'I am a reference object ', desc:' I changed desc in the if block '} the fourth output a: {name: 'I am a reference object ', desc:' I changed desc in the if block '}Copy the code

Because both external A and internal A point to the same object, when internal A changes the attribute value of the object, external A naturally outputs the changed result when printing.

This question comes from: juejin.cn/post/684490…