存档

文章标签 ‘closure’

JavaScript自执行匿名函数结合闭包特性运用

2013年11月22日 没有评论

经常使用JavaScript的同学应该注意过类似于下面这样结构的脚本语言

(function(){
… …
})();

著名的第三方类库jQuery就是用到这样的语法,这个就叫做“自执行匿名函数”

第一次看到这样的语法的时候其实感觉挺奇怪的,除了括号里面的匿名函数外“()();“,两个括号且以分号结尾,着实有点难以理解。其实仔细分析一下还是可以讲的通的。

首先,小括号在语句中起到”表达式组合分块“作用,并且每个分组都会有返回值,在控制台下运行执行下面的语句试试

alert(typeof function(){});   // “function”

可见自执行匿名函数的第一个括号返回的是一个“Function对象”,实际上小括号加上匿名函数返回的是一个匿名函数的引用,后面再加一个括号就跟普通函数的调用一样,由此便可以解释括号里面的匿名函数为什么可以达到自执行的效果了

结合闭包特性,对外实现接口封装

通常在复杂项目中会引用到多个JavaScript脚本,特别是在协同工作的时候,或者项目作为第三方库对外发布的时候,如果不做特殊处理,很容易出现变量、函数命名冲突。自执行匿名函数结合闭包特性可以有效实现有选择性地对外暴露接口

(function(){
  var foo = 'Hello';
  var bar = 'World!'

  function baz(){
      return foo + ' ' + bar;
  }
  function foo(){
      return foo + ' ' + bar;
  }

  window.baz = baz; //Assign 'baz' to the global variable 'baz'...
})();

console.log(baz()); //...and now this works.
console.log(foo()); //... do not works.

上面的代码运行结果,foo()之所以不执行是因为foo()的作用域限制,而baz()因为赋值作为window的属性而暴露在匿名函数之外,这样即可以保持foo()函数的私有特性,又可以对外提供接口.

 

 

 

分类: 前端技术 标签: ,