作用域在javascript中分為全域作用域和局部作用域，而局部作用域其實指得就是函數作用域，javascript將函數作為作用域的最小範圍。
在程式碼的任何地方都可以存取到的物件，例如window物件及window物件的屬性，就擁有全域作用域。
1、在最外層定義的變量，預設都是window物件的屬性；
2、未定義的變數預設都是全域的，預設也都是window物件的屬性； 這一條是經常犯的錯誤,但是新版瀏覽器已經修復了這個問題！
舉例如下：
var firstName = "leo";
function changeName() {
var secondName = "jut";
fullName = "jutleo";
function getName() {
console.log(secondName);
}
getName();
}
console.log(firstName);
console.log(fullName);//报错
// console.log(secondName);//报错
changeName();
// getName();//报错在函數中定義一個變數時，這個變數只對目前函數可見,javascript會搜尋目前函數的作用域，如果沒有找到，則繼續向上層搜索，直到在全域作用域也沒有找到會返回undefined；
var version = "version_1";
var f1 = function() {
console.log(version);//version_1
}
f1();在f1函數中沒有找到，繼續往上找
var version = "version_1";
var f2 = function() {
var version = "version_2";
console.log(version);//version_2
}
f2();在f2函數中直接找到
var socpe = "scope_01";
var f3 = function() {
console.log(scope); //undefined
var scope = "scope_02";
}
f3();這又是為什麼呢？原來javascript在f3函數內搜尋scope變量，並且找到了，這個時候外層的scope就被忽略了，但是執行到console.log(scope)時，scope還沒有被初始化，所以返回undefined
var f4 = function() {
var scope = "scope_02";
(function(){
var scope = "scope_03";
(function(){
console.log(scope); //scope_03
})();
})();
}
f4();嵌套也是要遵循同樣的規則的，先在函數內部查找，沒有找到繼續往上層找！
var x_scope = "leo";
var f5 = function() {
console.log(x_scope); //leo
}
var f6 = function() {
var x_scope = "jut";
f5();
}
f6();這又是為什麼呢？原來javascript函數巢狀時，作用域是由巢狀關係決定的，呼叫的順序忽略不記！
說了這麼多，這個作用域要如何使用呢？我們從以上例子可以看出，javascript在找出變數時，順序往上找的這個鏈條就會作用域鏈。在實際應用中變數的位置越深，讀寫的速度就越慢，直到找到全域作用域。
看範例：
function setLabelBgColor(){
document.getElementById("btn").onclick=function(){
document.getElementById("label").style.backgroundColor="red";
};
}根據作用域鏈的查找邏輯，找document變數必須遍歷整個作用域鏈，直到最後在全域物件中才能找到，這個函數引用了兩次。優化如下：
function setLabelBgColor(){
var doc = document;
doc.getElementById("btn").onclick=function(){
doc.getElementById("label").style.backgroundColor="red";
};
}這個只是個例子，這麼做並不會大幅提升效能喔！但是在實際使用中要避免全域變數被大量存取的情況。
(function(exports){
//do some thing ...
})(window);思考一下，為什麼看到的函式庫、框架都是這麼開始的？
以上是JavaScript高級特性- 作用域的範例程式碼詳情的詳細內容。更多資訊請關注PHP中文網其他相關文章！
