self-Executing Anonymous Functions

       当我们学习javascript,我们把所有的注意力都给了变量,函数,条件语句,循环和事件,很少注意到我们该如何组织我们的代码在一个紧密相连的结构里面。


我们拿下面的代码来做个试验:

var foo='hello';
var bar='world';

function baz(){
  return foo+" "+bar;
}
console.log(baz());

这种风格的代码看起来好像没有什么问题,运行的很好,不会导致任何错误,在目前来看是的!


但是当这些代码,被应用在一个庞大的应用里面的时候,开始变成了一个大麻烦,全局命名空间里面被这些紧密相连的函数,变量充满,这将会导致许多的可能会有的未知的错误。


想要让你的代码变的优美和模块,在javascript中第一步要学习的就是自我执行匿名函数:

(function(){
   console.log('hello world');
})();


仔细的观察,这段代码有两个关键的部分组成。


第一部分就是匿名函数:

(function(){

//Normal codes goes here

})

真正有趣的部分是当我们向这个匿名函数结尾的的右边添加下面的东西:

();

这个小括号将导致前面的在前面的括号内的所有的代码被立即执行



所有的变量和函数--在匿名函数内定义的都不能被外面的代码访问,有效的利用了闭包将自己和外面的世界隔开了。

我们有这种设计模式把我们前面的栗子包裹起来:


(function(){
var foo='hello';
var bar='world';

function baz(){
  return foo+" "+bar;
}
})();
console.log(foo);
console.log(bar);
console.log(baz());
最后的三行都会爆出错误。理由是foo,bar,baz()都没有定义,现在在上面的代码中外部的代码是无法访问匿名函数内部的代码的。为了访问内部代码我们需要将里面的一个定义为全局的对象


(function(){
var foo='hello';
var bar='world';

function baz(){
  return foo+" "+bar;
}
window.baz=baz;
})();
//console.log(foo);//won't work
//console.log(bar);//won't work
console.log(baz());//'hello world'


这种模式最大的好处就是,你看上面栗子的代码,我们仍就无法直接访问匿名函数内部的变量,这样他们变得私有,想访问他们呢只有一个方法那就是我们自己定义的公开的特权方法。

我们可以传入参数到我们的匿名函数内部:
(function(window){
var foo='hello';
var bar='world';

function baz(){
  return foo+" "+bar;
}
window.baz=baz;
})(window);
当你使你的代码变得有意义,这中设计模式将会变得很有好处,


全部和window有关的代码在函数内部可以被重新命名为另个名字比如“a”:

(function(a){
console.log(a===window);//true
})(window);

(function(a){
var x;
console.log(x===window);//false
console.log(x===undefined);//true
console.log(a===window);//true
})(window);

在函数内参数名纯粹是一种约定,起到占位符的作用,即使你不写参数名也没事还是会有参数,传入的实参将会被保存在一个arguments对象里面里面,访问参数就需要argument[i]


这种设计模式的好处在你以后的实践中将会越来越明显,自动执行匿名函数会允许你去创建更复杂的但是却更加的直观和结构化的大型项目,并且让项目变得易于管理。

  • 1
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值