Why do I have to add var to define the I variable in the js for loop?

For example.
Copy codeThe Code is as follows:
For (I = 0; I <10; I ++) {// It is not written as: var I = 0
Alert (I );
}

However, this is really not a good habit. Next I will explain why var must be added to the Js for loop, otherwise it will bring you annoying and difficult to query bugs from time to time.
For example, we want to implement the following functions: Output
10
20
30
40
50
60
70
80
90
100
Using the following code, WriteNumber starts from 1 to 10 cycles, and the TenTimes method is called each cycle to return 10 times the index value.
Copy codeThe Code is as follows:
<Script type = "text/javascript">
Function WriteNumber (){
For (I = 1; I <= 10; I ++ ){
Document. write (TenTimes (I) + "<br/> ")
}
}
Function TenTimes (v ){
Var result = 0;
Alert (I );
For (I = 1; I <= 10; I ++ ){
Result + = v;
}
Return result;
}
WriteNumber ();
// Alert (I)
</Script>

You will find that only 10 is output. You can run the test in the following code box.

[Ctrl + A select all Note: If you need to introduce external Js, You need to refresh it to execute]
If var is not added to the WriteNumber and TenTimes methods, there are four situations:
In the first case, WriteNumber and TenTimes each have one for loop, and neither of them declares the I index variable with var.
Running result: alert returns 1. Only 10 results are output, not what we want.
Analysis: When executing WriteNumber, the declared variable I is not found in its scope. If I is assigned a value directly, I is implicitly declared as a global variable, (If you assign a value to a variable that has not been declared in a function, it is implicitly declared as a global variable .) At the beginning of the loop, I = 1. Call the TenTimes method and find that the TenTimes method has not declared the variable I. Therefore, the I in TenTimes is the global variable I, which is the same as the I in WriteNumber. At this time, line9 alert naturally comes out of 1. TenTimes loops 10 times, so that the global I is changed to 11, and the natural WriteNumber will not execute 2nd loop operations.
Verification: If alert (I) is added after the WriteNumber (); statement, that is, the line16 comment is canceled, alert generates 12 (12 = 10 + 2 I ++ ), it proves that I is a windows Object at this time.
In the second case, WriteNumber declares the I variable, that is, line3: var I = 1. TenTimes does not declare the I variable, that is, line10: I = 1.
Running result: the I undefined error is reported at line9 alert (I). Because WriteNumber has declared the variable I, it is not a global I, and I is not declared during TenTimes execution, therefore, the message is undefined. If line9 is commented out, the output result is correct. When I = 1 is run in TenTimes, I is declared as a global variable implicitly without affecting I in WriteNumber. WriteNumber still executes 10 cycles.
Verification: If alert (I) is added after the WriteNumber (); statement, that is, the line16 comment is canceled, alert will find that 11 (I ++ in 11 = 10 + TenTimes) is generated ), it proves that windows exists. i.
In the third case, WriteNumber does not declare the I variable, that is, line3: I = 1. TenTimes declares the I variable, that is, line10: var I = 1.
Running result: 10 undefined items are displayed. Because WriteNumber does not declare I, I is declared as a global variable implicitly, while TenTimes has declared variable I (In addition, variables are declared in pre-compilation ), so I in line9 alert (I) is not windows. i, but the variable I declared by TenTimes, Which is undefined. At the same time, it is found that the output result is correct because the TenTimes I does not affect the global I of WriteNumber, And the WriteNumber still executes 10 cycles.
Case 4: Both WriteNumber and TenTimes declare I with var.
Running result: Comment out line9. If you don't talk about it, the result is perfect.
Although the output results are correct in the second and third cases, the use of I is messy. It should be luck that leads to correct results, because exactly one is window. i. One is the private variable I in the function, so that there is no conflict.
Although this article focuses on why var must be added to the write for loop, it is actually about the scope of the variable (or the lifecycle of the variable ). After understanding it, you should be able to accurately answer the following two code execution results.

[Ctrl + A select all Note: If you need to introduce external Js, You need to refresh it to execute]

[Ctrl + A select all Note: If you need to introduce external Js, You need to refresh it to execute]
Ps: Speaking of the good habits of coding, think of this: if (a = 3) should be written as if (3 = ). Because we usually write = as 1 =. If we write only one = variable on the right side, a compilation error will be reported, so that errors can be detected in time.