大家都知道,js全局变量是每个js函数都能访问和改变其值的,它的作用范围也是整个js文件。但是最近我却碰到一种情况导致全局变量在某个“角落”访问不到,很郁闷。但是却是一个值得注意的小细节,记录下吧。
<html>
<head>
<script src="jquery-1.8.3.min.js"></script>
<script>
var dimen = 'day';//全局变量
$(function(){
//console.log("dimen:" + dimen);
$("#btn").click(function() {
alert(dimen);
});
if(false) {
var dimen = 'good';
}
});
function change() {
dimen = $("#time").val();//改变全局变量
//some code....
}
</script>
</head>
<body>
<input type="button" value="测试" id="btn" />
<select id="time" οnchange="change()">
<option value="year">年</option>
<option value="year">月</option>
<option value="year">日</option>
</select>
</body>
</html>
这个页面上点击“测试”按钮你会发现直接弹出undefined,奇怪的是dimen不是全局变量吗怎么会访问不到呢?
仔细检查你的$(function(){})函数里面的这段代码:
if(false) {
var dimen = 'good';
}
你会发现你又重新定义了一个局部变量dimen,和全局变量重名了,这导致dimen瞬间变成局部变量而外部访问不到了。经测试,只有你在$(funciton(){})里这样定义一个跟全局变量重名的局部变量,才会出现这种情况!!
虽然是个小问题但也是我工作中遇到的,顺便提下还是需要多多注意这种比较隐晦的情况。。