一个js变量以及其作用域的源码示例

今天遇到了一个问题，抽象出来的代码如下：

var zoom=13;

function setZoom(){

zoom=14;

}

function displayZoom(){

this.setZoom();

alert(zoom);

var zoom=1500;

this.changeZoom();

alert(zoom);

}

function changeZoom(){

this.zoom=++zoom;

}

执行结果

………………………………………………

…………………………

………………

很诧异 undefined 1500

找找原因，是因为displayZoom()内部重新定义了zoom变量，去掉这个var

var zoom=13;

function setZoom(){

zoom=14;

}

function displayZoom(){

this.setZoom();

alert(zoom);

zoom=1500;

this.changeZoom();

alert(zoom);

}

function changeZoom(){

this.zoom=++zoom;

}

执行结果是

………………………………

……………………

14 1501

不诧异了

找了找解释：任何程序语言中变量的作用域都是一个很关键的细节。JS中变量的作用域相对与JAVA、C这类语言显得更*，一个很大的特征就是JS变量没有块级作用域，函数中的变量在整个函数都中有效

简单的说

function displayZoom(){

this.setZoom();

alert(zoom);

var zoom=1500;

this.changeZoom();

alert(zoom);

}

这段代码，执行时，等同于

function displayZoom(){

var zoom;

this.setZoom();

alert(zoom);

zoom=1500;

this.changeZoom();

alert(zoom);

}

所以执行结果是：undefined 1500

p.s,为了避免上面的这类问题，因此在函数开始位置集中做函数声明是一个极力推荐的做法。

dml@2013.8.22