在 requireJS 模块定义周围包装额外的立即调用函数是否有充分的理由?
我在 GitHub 中查看 Backbone-requireJS 样板,看到两种不同类型的实现。
https://github.com/david0178418 /BackboneJS-AMD-Boilerplate/blob/master/src/js/views/viewStub.js 具有以下内容作为 viewStub:
function() {
"use strict";
define([
'jqueryLoader',
'underscore',
'backbone',
],
function($, _, Backbone) {
return Backbone.View.extend({
template : _.template(/*loaded template*/),
initialize : function() {
this.render();
},
render : function() {
$(this.el).append(this.template(/*model/collection*/));
return this;
}
});
}
);
})();
而来自其他样板的视图存根 https://github.com/jcreamer898/RequireJS -Backbone-Starter/blob/master/js/views/view.js 具有以下内容:
define([
'jquery',
'backbone',
'underscore',
'models/model',
'text!templates/main.html'],
function($, Backbone, _, model, template){
var View = Backbone.View.extend({
el: '#main',
initialize: function(){
this.model = new model({
message: 'Hello World'
});
this.template = _.template( template, { model: this.model.toJSON() } );
},
render: function(){
$(this.el).append( this.template );
}
});
return new View();
});
我的问题是: 为什么第一个示例中整个 RequireJS 模块都有一个自执行函数?
I was looking at the Backbone-requireJS boilerplates in GitHub, I see two different types of implementations.
https://github.com/david0178418/BackboneJS-AMD-Boilerplate/blob/master/src/js/views/viewStub.js has the following as the viewStub:
function() {
"use strict";
define([
'jqueryLoader',
'underscore',
'backbone',
],
function($, _, Backbone) {
return Backbone.View.extend({
template : _.template(/*loaded template*/),
initialize : function() {
this.render();
},
render : function() {
$(this.el).append(this.template(/*model/collection*/));
return this;
}
});
}
);
})();
Whereas the view-stub from the other boilerplate
https://github.com/jcreamer898/RequireJS-Backbone-Starter/blob/master/js/views/view.js has the following:
define([
'jquery',
'backbone',
'underscore',
'models/model',
'text!templates/main.html'],
function($, Backbone, _, model, template){
var View = Backbone.View.extend({
el: '#main',
initialize: function(){
this.model = new model({
message: 'Hello World'
});
this.template = _.template( template, { model: this.model.toJSON() } );
},
render: function(){
$(this.el).append( this.template );
}
});
return new View();
});
My question here is:
Why is there a self-executing function around the whole RequireJS module in the first example?
如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
发布评论
评论(2)
本例中不需要包含闭包。它创建一个作用域,以便声明的变量或函数不会泄漏到全局作用域中。但是,当您不创建变量或命名函数时,就不会泄漏任何内容。所以没有太多意义。
真正的原因可能比你想象的要简单。就像即使周围没人也使用转向灯一样,将每个 JS 源文件包含在一个自执行函数中是一个值得养成的好习惯。它可以让你避免犯愚蠢的错误。所以这可能只是防御性编程风格的一个例子。
此示例没有任何好处,但运行时的相关性能成本完全可以忽略不计。那么为什么不以“正确”的方式来做呢,以防万一有新的人进来并以某种时髦的方式“维护”这个模块呢?
There doesn't need to be a containing closure in this example. It creates a scope so that declared variables or functions don't leak into the global scope. But when you are not creating variables or named functions, then there is nothing to leak. So there isn't much point.
The real reason may be simpler than you think. Like using the turn signal even if noone is around, enclosing every JS source file in a self executing function is a good habit to get into. It saves you from stupid mistakes. So it may just be an example of a defensive programming style.
There is no benefit in this example, but the related performance cost at runtime is totally negligible. So why not do it the "right" way in case some one new comes in and "maintains" this module in some funky ways?
这样做完全没有意义,因为您已经有一个创建自己的名称空间的函数。
此外还有一个缺点 - 你会得到额外的缩进,因此你的代码变得不太可读。
There is totally no point in doing this, because you already have a function that creates its own namespaces.
Moreover there is a disadvantage - you are getting an extra indent, so your code becomes less readable.