zoukankan      html  css  js  c++  java
  • 自执行匿名函数剖析

    引入

    在很多js代码中我们常常会看见这样一种写法:

    (function( window, undefined ) {
        // code
    })(window);

    这种写法我们称之为自执行匿名函数(self-executing anonymous function)。

    正如它的名字一样,它是自己执行自己的,前一个括号是一个匿名函数,后一个括号代表立即执行。


    函数和函数表达式的区别

    • 语法
    复制代码
    function keqing(){   //函数
        alert('Hi~');  
    }

    var keqing = function(){ //函数表达式
      alert('Hi~')
    }
    复制代码
    • 函数的函数声明有一个重要特征 —— 函数声明提升 
    复制代码
    keqing();   //Hi~
    function keqing(){
      alert('Hi~');
    }

    函数:在读取执行代码之前会先读取函数声明
    复制代码
    复制代码
    keqing();  // Uncaught TypeError: keqing is not a function
    var keqing = function(){
      alert('Hi~');
    }

    函数表达式:没有函数声明提升,在执行前必须先赋值
    复制代码
    • 回到我们的自执行匿名函数
    复制代码
    function(){
       alert('aaaa');  
    }()  //出错,因为这是一个匿名函数,函数后不能跟圆括号


    ---------------> 函数声明想要变成函数表达式,就需要给它加一个圆括号

    (function(){
      alert('aaaa');
    })() // aaaa 这样就变成了自执行匿名函数

    复制代码

    自执行匿名函数剖析

    回到我们最开始的栗子,

    (function( window, undefined ) {
        // code
    })(window);

    1.自执行匿名函数写法的好处:防止变量名冲突

    2.自执行匿名函数的其他多种写法:

    复制代码
    ( function() {}() );
    ( function() {} )();
    [ function() {}() ];
    
    ~ function() {}();
    ! function() {}();
    + function() {}();
    - function() {}();
    
    var f = function() {}();

    //当然不需要都记住,会用就OK。还有很多不常见的我就不一一举例了..
    复制代码

    3.为何要传入window?

    这样传入window可将其从全局变量变为局部变量,在函数作用域内可以直接访问到window,就不用将作用域链退回到顶层作用域了。

    在压缩代码时,可以对window进行优化。

    4.为何要增加参数undefined?

    由于undefined在一些情况下有可能会被重写,为确保在自执行匿名函数里的undefined是"真的undefined",就需要增加参数undefined。

  • 相关阅读:
    玩家上线
    小退
    GS发包到MS
    share初始化
    3 水仙花数
    The left-hand side of an assignment must be a variable,代码中使用了中文的字符
    Mac Sublime Text 浏览器 设置快捷键 让html文件在浏览器打开
    2 质数求解
    1 斐波那契的兔子
    18 赛手的名单
  • 原文地址:https://www.cnblogs.com/yulei126/p/6789811.html
Copyright © 2011-2022 走看看