zoukankan      html  css  js  c++  java
  • function foo(){}、(function(){})、(function(){}())等函数区别分析

      前面一段时间,看到(function(){}),(function(){}())这些函数就犯晕,不知道它到底是什么意思,为什么函数外要加小括号,函数后要加小括号,加和不加到底有什么区别……一直犯迷糊,看了汤姆大叔的《深入理解JavaScript系列(4):立即调用的函数表达式》后才明白它们到底是什么东西,终于将困扰我已久的东西给干掉了。

      在这里,我先介绍一下函数引用和函数调用的差别、函数声明表现形式和函数表达式的表现形式。

      一、函数引用和函数调用的差别

      函数引用和调用的差别与函数名称后是否有小括号()有关,函数引用只会单独出现,但函数调用后面必定会带有一个小括号,很多时候还附有自变量。

      表示方式(举例说明):

    function foo(){
        //函数体
    }
    var f = foo;  //函数引用
    var ff = foo();  //函数调用,可直接调用foo(),也可调用f()

      二、函数声明的表现形式

      带有函数名的函数是函数声明,包括保留字function,函数名(必有),圆括号中的参数(可有可无)和花括号中的函数主体。

      表示方式(举例说明):

    function foo(str){
        //函数体
    }

      三、函数表达式的表现形式

      赋值函数,函数外带有小括号的函数是函数表达式(就举两个例子),包括赋值变量(可有),函数外小括号(可有),保留字function,函数名(可有可无),圆括号中的参数(可有可无)和花括号中的函数主体。

      表示方式(举例说明):

    //赋值型函数表达式
    var f = function foo(str){
        //函数体
    }
    //分组括号型函数表达式,这是立即执行函数表达式,后面会讲解
    (function(){
        //函数体
    })();

      四、函数实例

      第一种:

    var foo = function(){}

      分析:该函数为函数表达式,也可以理解成是一个引用,用foo()调用可执行。

      第二种:

    var foo = function(){}();

      分析:该函数为立即调用函数,这和第一种的区别就是后面有无小括号,也就是函数调用和函数引用的区别,函数调用可理解为自执行函数(最好在function(){}外加一个括号变成(function(){})(),更规范一点);

      第三种:

    function(){}

      分析:该函数缺少名称,未赋值,所以报错。

      第四种:

    function(){}()

      分析:function(){}是语句,不是函数表达式,只有表达式才能调用,所以报错。

      第五种:

    (function(){})();

      分析:(function(){})是函数表达式,能调用,称为匿名自执行函数。

      第六种:

    (function(){}());

      分析:(function(){}())是函数表达式,可用,称为匿名自执行函数(汤姆大叔推荐的写法,我更喜欢第五种写法)。

      第七种:

    function foo(){}

      分析:该函数为实名函数,可调用。

      第八种:

    function foo(){}();

      分析:解释和第四种一样,因为function foo(){}是语句,不是表达式,不能调用,所以报错。

      第九种:

    function foo(){}(a);

      分析:解释和第四种一样,因为function foo(){}是语句,不是表达式,不能调用,但是因为后面括号中传入了参数,所以未抛出异常,也就为报错,但是本身还是不执行的。

      第十种:

    (function foo(){});

      分析:function外添加一个括号,所以外部作用域就不能调用foo()这个函数了,里面被当做匿名函数了,我个人认为这样的函数没什么意义,既不能调用也不能自执行。

      第十一种:

    (function foo(){})();

      分析:有了十,这个就可以理解为是匿名自执行函数了。但是在ie8以下能执行,该表达式被当做函数声明,函数声明有种“置顶解析”的行为,就是不管函数在哪个地方定义,它都会在该作用域顶部默认声明好。

      第十二种:

    !function(){}();

      分析:其实小括号和js的&&,异或,感叹号等操作是在函数声明和表达式消除歧义的,为可执行的。

      第十三种:

    new function(){}();

      分析:可执行。

      最后,非常感谢。有哪里讲解的不好或者是不正确的地方,希望大家能第一时间反馈给我,希望和大家共同进步~

  • 相关阅读:
    实现用户信息的增删改-mongoose数据库操作
    gulp使用流程及常用插件
    Js面向对象动态添加标签页,Tab栏切换
    类似淘宝侧边栏jq代码编写
    jQuery选择器
    jQuery-突出显示案例
    隔行变色加高亮显示
    ajax请求到后台
    LOOK OUT THE HOLE!
    应用keyup监测输入框兼容IE处理
  • 原文地址:https://www.cnblogs.com/tattoo/p/3645572.html
Copyright © 2011-2022 走看看