javascript——作用域、debug断点调试

作用域

作用域：是指一个变量的作用的范围

全局作用域：

直接编写在script标签的js代码，是全局作用域；

全局作用域在页面打开时创建，在页面关闭时销毁；

在全局作用中有一个全局对象window，它代表的是一个浏览器的窗口，它由浏览器创建，我们可以直接使用

在全局作用域中，创建的变量都会作为window对象的属性保存；创建的函数都会作为window对象的方法保存

变量的声明提前：使用var关键字声明的变量，都会在所有的代码之前被声明，如果声明变量时不使用var关键字，则变量不会被声明提前

<script>
        console.log(a); //undefined
        console.log(b); //报错b is not defined
        var a = 46576;
        b = 4687542;
    </script>

函数的声明提前：使用函数声明形式创建的函数 function 函数名(){}，它会在所有的代码执行之前就被创建，所以我们可以在函数声明前来调用函数；使用函数表达式创建的函数 var fn =function(){}，不会被声明提前，所以不能在声明前调用

<script>
        fn(); //456132
        fun(); //报错：fun is not a function
        // 函数声明
        function fn() {
            console.log(456132);
        }
        // 函数表达式
        var fun = function() {
            console.log(888888);
        }
    </script>

函数作用域

调用函数时创建函数作用域，函数执行完毕后，函数作用域销毁；

每调用一次函数就会创建一个新的函数作用域，他们之间是相互独立；

在函数作用域中可以访问全局作用域中的变量，但是在全局作用域无法访问到函数作用域中的变量

当在函数作用域操作一个变量时，它会先在自身作用域中寻找，如果有就直接使用，如果没有则向上一级作用域中寻找，直到找到全局作用域，如果全局作用域中依然没有找到，则会报错 Uncaught ReferenceError

在函数中要访问全局变量可以使用window对象

在函数作用域也有声明提前的特性，使用var关键字声明的变量，会在函数中所有的代码执行之前被声明，函数声明也会在函数中所有的代码执行之前执行

在函数中，不使用var声明的变量都会成为全局变量；

定义形参就相当于在函数作用域中声明了变量

<script>
        console.log(a); //undefined
        // console.log(b); //报错b is not defined
        console.log(c);
        var a = 46576;
        b = 4687542;
    </script>

小练习

<script>
        var a = 123;

        function fun() {
            // 这里的a是函数作用域中的a，变量声明提前，但在赋值前使用，所以是undefined
            alert(a);
            var a = 456;
        }
        fun(); //undefined
        // 这里的a是全局作用域中的a
        alert(a); //123
    </script>

<script>
        var a = 123;

        function fun() {
            // 局部没有a，所以去全局作用域中找a
            alert(a);
            // 这里没有用var，所以是全局变量，也不可以声明提前
            a = 456; //这里将a的值从123改成456
        }
        fun(); //123
        alert(a); //456
    </script>

<script>
        var a = 123;
        // 函数定义了形参，所以形参就相当于在函数作用域中创建的一个变量
        function fun(a) {
            // 这里的a是定义的形参变量
            alert(a);
            a = 456; //因为函数作用域里面里面有形参变量a，所以这里是给形参赋值
        };
        // 这里调用函数，没有传递实参，所以形参变量只定义未赋值
        fun(); //undefined
        alert(a); //123，这里的a是全局作用域中的a
    </script>

<script>
        var a = 123;
        // 有形参a，就在函数作用域内创建了一个变量
        function fun(a) {
            alert(a);
            a = 456; //修改形参的值
        };
        // 传递实参，给形参赋值
        fun(123); //123，这里的a是函数作用域中的形参
        alert(a); //123,这里是全局作用域中的a
    </script>

debug（断点调试）

想要清楚的知道程序代码的步骤，想要在哪停，就是那行代码打个断点

在sources界面，在代码区选中要调试的位置

刷新一下后，界面发生一点点变化，就可以开始进行调试了（主要就用两个指令）

想要停止调试，先取消断点，再点击停止调试就可以了