• 自执行函数


    原文链接:https://my.oschina.net/u/2331760/blog/468672?p={{currentPage+1}}

    函数基本概念:

    函数声明:function box(){}

    函数表达式:var box = function(){};

    匿名函数:function(){} 属于函数表达式

        匿名函数的作用:如果将匿名函数赋值给一个变量,则声明了一个函数: var box= function(){};

                如果将匿名函数赋予一个事件则成为事件处理程序: box.addEventListener("click",function(){alert("aaa")});

                创建闭包:(function(){})()

    函数定义的三种方法:

      var box = function(){};

      function box(){}

      var box = new Function();

    函数声明和函数表达式的不同:

      js在进行预解析时函数声明会提升,而函数表达式必须js顺序执行到此函数代码时才会逐行解析

      函数表达式后面加括号可以立即执行函数,函数声明不可以,只能以fnName()的方式调用才行

      实例:

    box();
    function box(){
      alert("aaa");  
    }
    //正常,因为js在解析阶段函数声明会被提升到最前面,所以函数声明可以在函数执行后面
    //实际顺序
    //function box(){
      alert("aaa");
    }
    //box();

    box();
    var box = function(){
      alert("aaa");
    }
    //报错,实际上的顺序是
    //var box = undefined;
    //box();
    //box = function(){
      alert("aaa");
    }
    //所以当执行到box()时,此时box不是一个函数

    var box = function(){
      alert("aaa");
    }()
    //正确 函数表达式后面加括号,当执行到后面的括号时js会自动执行此函数

    function box(){
      alert("aaa");
    }()
    //不会报错,但是只会解析函数声明,忽略后面的括号,不会自执行

    function(){
      alert("aaa")
    }()
    //语法错误
    //虽然匿名函数属于函数表达式,但未进行赋值给一个变量
    //当js解析到function时,将其看成函数声明,报错,需要一个函数函数名

     函数自执行

    (function(a){
      alert(a);  
    })("123")
    
    //"123" 使用()运算符
    
    (function(a){
      alert(a);  
    }("123"))
    
    //"123" 使用()运算符
    
    !function(a){
      alert(a);
    }("123")
    //"123" 使用!运算符

    +function(a){
      alert(a);
    }("123")
    //"123" 使用+运算符

    -function (a){
      alert(a);
    }("123")
    //"123" 使用-运算符

    var fn= function(a){
      alert(a);
    }("123")
    //"123" 使用=运算符

      在function前面加!、+、-、=都可以将函数声明转化为函数表达式,消除了js引擎识别函数声明和函数表达式的歧义,

    加()是最安全的方法,免得其他的和函数返回值进行运算

    不过这样的写法有什么用呢?

    javascript中没用私有作用域的概念,如果在多人开发的项目上,你在全局或局部作用域中声明了一些变量,可能会被其他人不小心用同名的变量给覆盖掉,

    根据javascript函数作用域链的特性,可以使用这种技术可以模仿一个私有作用域,用匿名函数作为一个“容器”,

    “容器”内部可以访问外部的变量,而外部环境不能访问“容器”内部的变量,

    所以( function(){…} )()内部定义的变量不会和外部的变量发生冲突,俗称“匿名包裹器”或“命名空间”。

    JQuery使用的就是这种方法,将JQuery代码包裹在( function (window,undefined){…jquery代码…} (window)中,在全局作用域中调用JQuery代码时,可以达到保护JQuery内部变量的作用。

     

  • 相关阅读:
    (译) 在AngularJS中使用的表单验证功能
    TypeError: Cannot red property 'style' of null 错误解决
    Velocity CheckingForNull
    推荐系统(Recommendation system )介绍
    python 时间戳和日期相互转换
    Markdown 语法的简要规则
    mpvue + 微信小程序 picker 实现自定义多级联动 超简洁
    微信小程序 上传图片并等比列压缩到指定大小
    vue路由的两种模式,hash与history的区别
    修改浏览器url地址或者参数 , 实现不刷新页面
  • 原文地址:https://www.cnblogs.com/wxiaona/p/6016863.html
Copyright © 2020-2023  润新知