美文网首页
关于js立即执行的原理及写法

关于js立即执行的原理及写法

作者: aibinMr | 来源:发表于2019-11-25 16:15 被阅读0次

    1. (function(){}())与(function(){})()

    这两种写法,都是一种立即执行函数的写法,即IIFE (Immediately Invoked Function Expression)。这种函数在函数定义的地方就直接执行了。

    通常的函数声明和调用分开的写法如下:

    function foo() {/*...*/}     
    // 这是定义,Declaration;定义只是让解释器知道其存在,但是不会运行。 foo();                   
    // 这是语句,Statement;解释器遇到语句是会运行它的。
    

    普通的函数声明function foo(){}是不会执行的。这里如果直接这样写function foo(){}()解释器会报错的,因为是错误的语法。
    IIFE函数的调用方式通常是将函数表达式、它的调用操作符、分组操作符放到一个括号内,来告诉解释器这里有一个需要立即执行的函数。否则通常情况下,解析器遇到一个function关键字,都会把它当做是一个函数声明,而不是函数表达式。
    如下几种写法都是可以的:

    (function foo(){/*...*/}()); 
    (function foo(){/*...*/})(); 
    !function foo() {/*...*/}(); 
    +function foo() {/*...*/}();
     -function foo() {/*...*/}(); 
    ~function foo() {/*...*/}();
    

    在需要表达式的场景下,就不需要用括号括起来了:

    void function(){/*...*/}(); 
    var foo = function(){/*...*/}(); 
     true && function () { /*...*/ }();
     0, function () { /*...*/ }();
    

    void声明了不需要返回值,第二个则将IIFE函数的返回值赋给了foo。第三、第四个都是明确需要表达式的场景,所以解析器会认识这种写法。

    对于IIFE函数,也可以给它们传入参数,例如:

    (function foo(arg1,arg2,...){...}(param1,param2,...));
    

    对于常见的(function($){...})(jQuery);即是将实参jQuery传入函数function($){},通过形参$接收。
    上述函数中,最开始的那个括号,可能会由于js中自动分号插入机制而引发问题。例如:

    a  =  b  +  c ;(function  () {   // code })();
    

    如果没有第二行的分号,那么该处有可能被解析为c()而开始执行。所以有的时候,可能会看到这样的写法:;(function foo(){/*...*/}()),前边的分号可以认为是防御型分号。

    相关文章

      网友评论

          本文标题:关于js立即执行的原理及写法

          本文链接:https://www.haomeiwen.com/subject/wmrjwctx.html