理解javascript中的立即执行函数(function(){})() 

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>xxxxx</title>
</head>

<body style="background: #023365">

</body>

<script type="text/javascript">
    
    
    Aoo();//不报错
    //函数声明
    function Aoo(){
        console.log("Aoo");
    }
    
    
    /**
    Boo();//报错Boo is not a function,应该放在函数表达式之后。
    //函数表达式
    var Boo = function(){
        console.log("Boo");
    }
    */
    
    //在函数表达式之后加上括号之后，可以不用调用Coo方法
    //Coo()方法，COO方法都会自动执行
    var Coo = function(){
        console.log("Coo");
    }();
    
    
    //匿名函数之后不能添加括号，否则将会报错
    //function statement requires a name
    /**
    function(){
        console.log("Doo");
    }()
    */
    
    
    /*立即执行函数里面的函数必须是函数表达式，
      所以由var Coo = function() {}()可以理解
      为在匿名函数前加了 = 运算符后，将函数声明转化
      为函数表达式，所以拿！，+，-，（）...等运算符来测试下是否如此*/
    //注意：以下将申明函数转为函数表达式要加";"否则会出现
    //报错：intermediate value)(...) is not a function
    
    !function(){
        console.log(1)
    }();
        
    +function(){
        console.log(2)
    }();
        
    -function(){
        console.log(3)
    }()
        
    (function(){
        console.log(4)
    })()
    
    
    /*由此可见，加运算符确实可将函数声明转化为函数表达式，
    而之所以使用括号，是因为括号相对其他运算符会更安全，
    可以减少不必要的麻烦。立即执行函数与正常函数传参形式是一致的。*/
    var Eoo = function(var1,var2){
        console.log("Eoo:"+var1+var2);
    }(1,3);
    
    
    /*(function(){}())这样写的好处是在内部定义的变量
    不会跟外部的变量有冲突，达到保护内部变量的作用。*/
    
</script>
</html>

 

posted @ 2019-01-23 11:10  真某人  阅读(293)  评论(0)    收藏  举报