一步步學習javascript基礎篇（2）:作用域和作用域鏈

作用域和作用域鏈

js的語法用法非常的靈活，且稍不注意就踩坑。這集來分析下作用域和作用域鏈。我們且從幾道題目入手，您可以試着在心里猜想着答案。

問題一、

if (true) {
    var str = "李四";
}
alert(str);//彈出值是？

問題二、

function add(num1, num2) {
    var sum = num1 + num2;
}
add(1,2);
alert(sum) //彈出值是？

問題三、

var str1 = "張三";
var str2 = "李四";
function fun1() {
    var str2 = "王五";
    var str3 = "鄭六";
    alert(str1 + str2 + str3); //彈出值是？

} fun1();

 問題四、

var num1 = 10;
function fun1() {
    alert(num1);
}
function fun2(fn) {
    var num1 = 12;
    fn();
}
fun2(fun1); //彈出值是？

 js中沒有塊級作用域

答案一：

if (true) { var str = "李四"; } alert(str);

 我們看到了，彈出值是”李四“。這說明了js中沒有塊級作用域（這和我們以前接觸的其他語言不同）。不僅if里面是這樣，for、while...等等都是這樣。

如：

for (var i = 0; i < 10; i++) { } alert(i);

 js中只有函數作用域和全局作用域

我們只能從外層內層作用域訪問外層作用域，而外層作用域不能訪問內層作用域。

 答案二：

function add(num1, num2) { var sum = num1 + num2; } add(1,2); alert(sum)

 （沒反映？因為報異常了。不信F12看）如此，我們是訪問不到sum的。因為sun是屬於add函數內的作用域。  我們只能從add函數內訪問到全局作用域的變量值。

js中的作用域鏈

 答案三:

var str1 = "張三 "; var str2 = "李四 "; function fun1() { var str2 = "王五 "; var str3 = "鄭六 "; alert(str1 + str2 + str3); } fun1();

str1取全局作用域、str3去fun1函數作用域的。這里有些疑惑的是str2了。這里就引入了作用域鏈。

 

一般我們都說，先從自己的作用域取變量，沒取到然后去父作用域中取。這句話沒錯，不過有時候也會產生疑惑或是混淆。如答案四：

var num1 = 10; function fun1() { alert(num1); } function fun2(fn) { var num1 = 12; fn(); } fun2(fun1);

 “先從自己的作用域取變量，沒取到然后去父作用域中取”，這里fun1的父作用域是全局作用域，而不是fn()調用時fun2中的作用域。所以我們可以把這句話改成“先從自己的作用域取變量，沒取到然后去自定自己的地方的父作用域中取”。

暫且分析到這里了。后續如果有新的理解再補充進來。

 

---

 

注意：

• 當循環嵌套時千萬不要忘記修改循環條件的變量名如：(這樣就死循環了)

for (var i = 0; i < 4; i++) {
    //......
    //......
    for (var i = 0; i < 2; i++) {
        alert("ok")
    }
    //......
    //......
}

 

 

 

這是學習記錄，不是教程。文中錯誤難免，您可以指出錯誤，但請不要言辭刻薄。

原文鏈接：http://haojima.net/zhaopei/513.html

本文已同步至目錄索引：一步步學習javascript

歡迎上海“程序猿/媛”、"攻城獅"入群：【滬猿】229082941 入群須知