自执行函数

javascript中为何在匿名function函数后面还外加一个括号?

 (function(){...}()) 或 (function(){...})()

名词解释:“匿名函数自执行”

定义一个匿名函数,然后马上调用它(因为它是匿名的,如果不立即调用就获取不到该函数的引用了)。通常它被应用在一些大型的JS框架中(如上面所说的),因为这个匿名函数的函数体相当于提供一个匿名的名字空间,这样就不会再与用户自定义的JS函数、变量、对象发生冲突了。尽管JS没有显示地提供命名空间的定义和使用机制,但这种匿名方式却不失为是一种很好的解决命名空间问题的方法。

Demo:基本使用

(function(){
  console.log("郑久胜!");
  })();

或者:

(function(){
  console.log("郑久胜!");
  }());

如果要传参的话:

(function(a1,a2){
  console.log("郑久胜!" +(a1+a2));  //郑久胜!3
  }(1,2));

下面列出几段代码作为比较:

function Fn() {
    var a = 123;
    this.a = 456;
    (function () {
        alert(a); // 123   
        alert(this.a); // undefined    
    })();
};
var f = new Fn();
function Fn() {
    var a = 123;
    this.a = 456;
    (function(_this) {
      alert(a); // 123
        alert(_this.a); // 456
    })(this);
  };
  var f = new Fn();

以上两个对比,说明:

  (1)匿名函数可以直接访问到外层署名函数(Fn)中的变量(使用关键字var定义的),但不能访问外层署名函数的属性(使用关键字this定义的);

  (2)匿名函数中的this指向的是匿名函数对象的地址,它与外层署名函数(Fn)对象的this指向的地址不同;

  (3)匿名函数若要访问外层署名函数(Fn)中的属性,可以通过参数传递的方式实现。

function Fn() {
    var a = 123;
    this.a = 456;
    (function(b) {
      alert(a); // 123
        alert(b); // 456
    })(this.a);
  };
  var f = new Fn();
(function() {
    var a = 123;
    this.a = 456;
    (function() {
      alert(a); // 123
        alert(this.a); // 456
    })();
  })();

以上两个对比,说明:

  (1) 匿名函数既可以直接访问外层匿名函数中的变量,又直接可以访问外层匿名函数中的属性,而匿名函数却不可以直接访问外层已命名函数中的属性;

  (2)以上两种方式可以实现相同的功能。

 

posted @ 2017-09-21 11:30  可恶の小郑  阅读(178)  评论(0编辑  收藏  举报