JS的预解析和全局和局部作用域

一、预解析

1、js引擎运行js分为两步： 预解析和代码执行

     （1）预解析：js引擎会把js里面的所有var还有function 提升到当前作用域的最前面  

     （2）代码执行： 按照代码书写的顺序从上往下执行

2、预解析分为变量解析（变量提升）和函数预解析（函数提升）

    （1） 变量提升：把所有的变量声明提升到当前的作用域最前面，不提示赋值操作

    （2） 函数提升：把所有的函数声明提升到当前的作用域最前面，不调用函数（函数表达式调用必须写在函数表达式的下面）

3、如何解析？

下面我们来看一个变量提升的例子：

         函数的预解析
        声明式的函数预解析时，整个函数将被提升到script标签内的最上面
        赋值式的函数预解析时，将赋值的变量提升到script标签内的最上面，后面的赋值函数忽略

        sayHello()
        声明式
        function sayHello() {
            console.log(sayHello);

        }
        sayHello()


        eat()
        run()
        赋值式
        var eat = function () {
            console.log("喜欢吃");

        }
        eat()

        预解析
        变量预解析:将声明的变量提升至script标签内的最上面
        console.log(a)由于变量的预解析,故此处打印的是undefined
        var a = 10
        console.log(a);由于上面已经进行赋值,故此处打印的是10

        var b = 10
        b()
        function b(){
            console.log(10);
            
        }
        b()

        作用域
        全局作用域:整个页面,只有当页面关闭时,全局作用域才会失效
        局部作用域：全局作用域中又划分出的小范围的作用域，函数内部可以创建局部作用域，
        到目前为止,也只有函数内部可以创建局部变量

        全局变量可以在函数内部进行访问,但是函数内部定义的变量不能再函数外部进行访问
        function text() {
            var a = "李四"
            console.log(a);
            function text2(){
                a = "王五"
                console.log(a);
                
            }
            console.log(a);
        }


        function text3(){
            num = 100
        }
        text3()
        console.log(num);
        

二、全局作用域

1.全局作用域：全局作用域中有一个全局对象window ,它代表的是一个浏览器的窗口，它由浏览器创建我们可以直接使用，
2.在全局作用域中：创建的变量都会作为window对象的属性保存，创建的函数都会作为window对象在方法保存
3.全局作用域中的变量都是全局变量 ，在页面的任意的部分都可以访问到

 var a = 10;
 var b = 20;
 function fu() {
            console.log("我是fu函数"+a)
            console.log(b) //全局定义的变量在任何部分访问到
        }
   window.fu(); //把函数fu()当做windoW的方法调用了

三、局部作用域（函数作用域）

1.调用函数时创建函数作用域，函数执行完毕以后，函数作用域销毁
2.调用一次函数就会创建一个新的函数作用域，他们之前是相互独立的
3.在函数作用域操作一个变量时，它会先在自身的作用域中寻找，如果有就直接使用，如果没有则向上一个作用域中寻找，直到找到全局作用域，如果全局作用域中依然没有找到,则会报错erfrernceERROR
4.在函数中访问全局变量可以使用window.对象

 var jay ="周杰伦"
 function getBox() {
            var num = "我是getBox函数里面的变量a"
            var num2 = "我是getBox函数里面的变量b"
            function getBox2() {
                var num3 = "我是getBox2函数里面的变量b"
                var num4 = "我是getBox2函数里面的变量c"
                console.log(num) //我是getBox函数里面的变量a
                console.log(num2) //我是getBox2函数里面的变量b
                console.log(num3) //我是getBox2函数里面的变量c
                console.log(window.jay) //周杰伦
            }
            getBox2()
        }
        getBox()