1 函数作用域
demo1,
var scope = "action 1"
function scopeTest() {
console.log(scope) // action 1
scope = "action 2"
console.log(scope) // action 2
}
scopeTest()
demo2,
var scope = "action 1"
function scopeTest() {
console.log(scope) // undefined
var scope = "action 2"
console.log(scope) // action 2
}
scopeTest()
仔细观擦demo1 与 demo2 仅仅一点区别，然而执行后的结果却是截然不同, 究其原因主要是因为Javascript 是函数作用域而不是块级作用域，函数作用域内命名的变量在函数内部起作用。
2 作用域链
scope = "action 1"
function scopeDemo (){
var name="action 2"
function scopeTest1 (){
var name="action 3"
console.log(name)
}
function scopeTest2 (){
console.log(name)
}
scopeTest1 () // action 3
scopeTest2 () // action 2
}
scopeDemo ()
在执行scopeTest1 时作用域链是 scopeTest1 -> scopeDemo() -> window
在执行scopeTest2 时作用域链是 scopeTest2 -> scopeDemo() -> window
3 作用域链与代码优化
从作用域链的结构可以看出，在运行期上下文的作用域链中，标识符所在的位置越深，读写速度就会越慢。
function changeColor(){
document.getElementById("btnChange").onclick=function(){
document.getElementById("targetCanvas").style.backgroundColor="red";
};
}
优化后:
function changeColor(){
var doc=document;
doc.getElementById("btnChange").onclick=function(){
doc.getElementById("targetCanvas").style.backgroundColor="red";
};
}
4 如何在Javascript 函数中实现块级作用域
在一个函数中定义的变量，当这个函数调用完后，变量会被销毁，我们可以用这个特性来模拟出JS的块级作用域。Javascript的闭包特性可以实现防止命名冲突。
function test(){
(function (){
for(var i=0;i<4;i++){
}
})();
alert(i);
}
test();
