js 作用域及作用域链

213 阅读1分钟

一、作用域

在 Javascript 中,作用域分为 全局作用域 和 函数作用域

全局作用域:

代码在程序的任何地方都能被访问,window 对象的内置属性都拥有全局作用域。

函数作用域:

在固定的代码片段才能被访问

例子:

  <script>
        let a = 10,
            b = 20;

        function fn() {
            let a = 100,
                w = 200;
            console.log(a, w);

            function fn2() {
                let a = 1000,
                    r = 2000;
                console.log(a, r);
            }

            fn2();
        }
        console.log(a, b);
        fn();
    </script>

image.png

作用域有上下级关系,上下级关系的确定就看函数是在哪个作用域下创建的。如上,fn作用域下创建了bar函数,那么“fn作用域”就是“fn2作用域”的上级。

作用域最大的用处就是隔离变量,不同作用域下同名变量不会有冲突。

变量取值:到创建 这个变量 的函数的作用域中取值

二、作用域链

一般情况下,变量取值到 创建 这个变量 的函数的作用域中取值。

但是如果在当前作用域中没有查到值,就会向上级作用域去查,直到查到全局作用域,这么一个查找过程形成的链条就叫做作用域链。

例子:

  <script>
        let a = 10,
            b = 100;

        function fn() {
            let b = 20;

            function fn2() {
                console.log(a + b);
            }

            fn2();
        }

        fn();
    </script>

image.png