JavaScript 作用域 和作用域链

作用域

作用域就是变量与函数的可访问范围，作用域控制着变量与函数的可见性和生命周期。换句话说，作用域决定了代码区块中变量和其他资源的可见性。

function fun() {
    var str = "函数内的变量";
}
fun();//要先执行这个函数，否则根本不知道里面是啥
console.log(str); // Uncaught ReferenceError: inVariable is not defined

变量 str 在全局作用域没有声明，所以在全局作用域下取值会报错。作用域就是一个独立的盒子，让变量不会外泄、暴露出去。不同作用域下同名变量不会有冲突。

作用域的图例：

ps： 作用域是分层的，内层作用域可以访问外层作用域的变量，反之则不行。

作用域链

声明一个函数时，局部作用域一级一级向上包起来，就是作用域链。
1.当执行函数时，总是先从函数内部找寻局部变量
2.如果函数的局部作用域没有，则会向创建函数的作用域（声明函数的作用域）寻找，依次向上。

下代码举例：

var a = 10,
    b = 20;
        function fn(x){
            var a = 100,
                c = 300;
                console.log('fn()',a,b,c,x); 
                function bar(x){
                    var a = 1000,
                        d = 400;
                        console.log('bar()',a,b,c,d,x); 

                }
                bar(100); //bar() 1000 20 300 400 100
                bar(200); //bar() 1000 20 300 400 200
        }
        fn(10); //fn() 100 20 300 10

首先 执行前

执行 bar(100)时

执行 fn(10)时

ps： 局部作用域没有时，会向创建函数的作用域依次向上寻找。