Effective JavaScript Item 12 understanding variable Hoisting

this series as effective JavaScript 's reading notes.

JavaScript not in Block Scoping , only Function Scoping .

so if in a Block defines a variable, then the variable is defined as the Block belong to the Function , such as:

function Iswinner (Player, others) {var highest = 0;for (var i = 0, n = others.length; i < n; i++) {<span style= "colo R: #ff0000; " >var player = others[i];</span>if (Player.score > highest) {highest = Player.score;}} return player.score > highest;}

In the above code, in the for A variable is declared in the loop player , because Variable Hoisting reason, this variable is actually declared as follows:

function Iswinner (Player, others) {<span style= "color: #ff0000;" >var Player;</span>var highest = 0;for (var i = 0, n = others.length; i < n; i++) {<span style= "color: #ff00 00; " >player = others[i];</span>if (Player.score > highest) {highest = Player.score;}} return player.score > highest;}

as a result, the incoming function in the player the parameters are overwritten. The program does not run as expected.

in the JavaScript , the declaration of a variable actually contains two parts:

1. Declaration itself
2. Assign value

JavaScript will pass Variable Hoisting Place the first part, which is the declared part, in the containing variable function 's head.

In the following example:

function Trimsections (header, body, footer) {for (var i = 0, n = header.length; i < n; i++) {Header[i] = Header[i].trim ();} for (var i = 0, n = body.length; i < n; i++) {Body[i] = Body[i].trim ();} for (var i = 0, n = footer.length; i < n; i++) {Footer[i] = Footer[i].trim ();}}

because variablehoisting 's sake, I and the N will be put in function , so in fact only two variables are declared, for loops, they are assigned values, and the actual behavior is this:

function Trimsections (header, body, footer) {<span style= "color: #ff0000;" >var I, n;</span>for (i = 0, n = header.length; i < n; i++) {Header[i] = Header[i].trim ();} for (i = 0, n = body.length; i < n; i++) {Body[i] = Body[i].trim ();} for (i = 0, n = footer.length; i < n; i++) {Footer[i] = Footer[i].trim ();}}

just because variablehoisting , some programmers prefer to define variables in the function At the beginning, equivalent to completing a manual Hoisting . This is done to avoid ambiguity and to make the code clearer.

However, there is a special case in Try ... .. Catch statement, Catch block is bound to the parameter in the Block Medium:

function test () {var x = "var", result = [];result.push (x); try {throw "exception";} catch (x) {<span style= "color: #ff00 00; " >x = "Catch"; </span>}result.push (x); return result;} Test (); ["Var", "var"]

Focus:

2. in the Block the variable declared in is implicitly hoisted to the containing their function at the beginning. (except for the catch blockmentioned above)
4. in a function , declaring a variable multiple times will eventually only declare a variable.
6. to avoid ambiguity, consider declaring variables in the function at the beginning.

Effective JavaScript Item 12 understanding variable Hoisting