JS作用域和预解析

JS实现了很多功能,丰富了html。JS留给人最深的印象就是,在JS中有很多的函数。构建函数总共有3种方式。

三种构建方式分别是声明函数、函数表达式、匿名函数。

  • ①声明函数:是用function关键字+函数名声明的函数
function text1(){
    //do something
    }
  • ②函数表达式:是用function关键字声明,再赋给一个变量的函数,在函数表达式中有无函数名不重要,如果设置了函数名,调用函数时不能通过函数名调用,此时的函数已经赋值给变量,函数名为undefined。
var i = function(){
    //do something
}
i();
//或者
var i = function text(){
    //do something
}
i();//text();是错误的
  • ③匿名函数:是用function关键字声明,但没有函数名。它可以赋给变量、事件,也可以起到一个保护变量的作用。比如说,这里第一层function将每一次for循环中的i值都记录下来,起到保护作用。
function(){
    //do something
}

//保护变量的作用举例
var i;
for(i = 0; i<10;i++){
    (function(i){
        function test2(){
             console.log(i);
         }
         test2();
     })(i);
}

那么,可以通过那些方式使得匿名函数被调用,立即执行呢?

  • ①在匿名函数的外面需要套一层()。注意:此方法函数声明不可以使用。()在不同的场合有不同的作用,如在算数表达式中(3+2)*5,代表提高优先级。

  • ②在匿名函数的前面加上‘+’、‘-’、‘!’、‘return’等,使之变成函数表达式,博主试过的中*、/、%是不可以使用的。

那么浏览器是如何解析JS的呢?
据博主目前所学,浏览器在解析JS之前至少有以下两个准备工作:

1、把变量、函数表达式的声明提升到当前作用域的最顶端;
2、把函数赋值;
3、其他工作;

例如:

function test3(){
    var x = 10;
    var i = function(){
        var j = 20;
    }
}

这里浏览器在解析之前做的工作相当于:

function test4(){
    var x,i;//将声明提到作用域的最前端
    x = 10;
    i = function(){
        var j; 
        j = 20;
    }
}

这里不知道有没有人会有疑惑,作用域到底是什么?
之前学到过全局变量和局部变量。按照我的理解,在JS中,全局变量有两种情况:

  • ①定义在函数外面的变量;
  • ②在定义时没有用var声明,直接是‘i = 10;’,此时不管该定义是否在函数内外,都是全局变量。

顾名思义,局部变量指的就是在函数内部的申明了。

所以,函数的作用域指的就是{}之内的区域,要注意的是,在JS中,只有函数才有局部作用域。

这里做以下几点总结:

  • ①全局变量可以在任何地方访问;
  • ②函数内的变量,对函数外是不可见的;
  • ③函数内部可以访问外部函数的变量;

如果有错误的地方,希望及时联系我更正,谢谢!