由于您只是在询问膨胀,让我们看一下一些代码。
JavaScript 与Backbone.Model.extend
如果你打开 Backbone 源代码,你会看到extend
函数如下:
var extend = function(protoProps, staticProps) {
var parent = this;
var child;
if (protoProps && _.has(protoProps, 'constructor')) { // _.has comes from
child = protoProps.constructor; // underscore, even
} else { // more 'bloat'
child = function(){ return parent.apply(this, arguments); };
}
_.extend(child, parent, staticProps); // more underscore
var Surrogate = function(){ this.constructor = child; };
Surrogate.prototype = parent.prototype;
child.prototype = new Surrogate;
if (protoProps) _.extend(child.prototype, protoProps);
child.__super__ = parent.prototype;
return child;
};
这里实际发生了什么:
当我们打电话
var Model = Backbone.Model.extend({urlRoot: '//some/url' });
我们得到类似的东西:
// Create new constructor which calls the parent constructor
var Model;
if (({}).hasOwnProperty.call({urlRoot: '//some/url' }, 'constructor') {
// this is false so...
} else {
Model = function(){ return Backbone.Model.apply(this, arguments); };
}
// Set up prototype chain
var Surrogate = function(){ this.constructor = model; };
Surrogate.prototype = Backbone.Model.prototype;
Model.prototype = new Surrogate;
// Add properties to the child prototype
// Same as:
// Model.prototype.urlRoot = '//some/url';
_.extend(Model.prototype, { urlRoot: '//some/url' });
// Set the magical __super__ property
Model.__super__ = Backbone.Model.prototype;
CoffeeScript 与extends
将其与 CoffeeScript 代码进行比较。你会看到,当你使用extends
一个名为__extends
gets 的神奇函数时,它会被添加到文件的开头,它(格式化时)看起来像:
__extends = function(child, parent) {
for (var key in parent) {
if (__hasProp.call(parent, key))
child[key] = parent[key];
}
function ctor() { this.constructor = child; }
ctor.prototype = parent.prototype;
child.prototype = new ctor();
child.__super__ = parent.prototype;
return child;
};
结合生成的JS:
var Model = (function(_super) {
__extends(Model, _super);
function Model() {
_ref = Model.__super__.constructor.apply(this, arguments);
return _ref;
}
Model.prototype.urlRoot = '//some/url';
return Model;
})(Backbone.Model);
这里实际发生了什么:
当我们打电话
Model extends Backbone.Model
urlRoot: '//some/url'
我们得到类似的东西:
// Create new constructor which calls the parent constructor
var Model = function () {
return Model.__super__.constructor.apply(this, arguments);
}
// Copy static properties from Backbone.Model to Model
for (var key in Backbone.Model) {
if (__hasProp.call(Backbone.Model, key))
Model[key] = Backbone.Model[key];
}
// Set up prototype chain
function ctor() { this.constructor = Model; }
ctor.prototype = Backbone.Model.prototype;
Model.prototype = new ctor();
// Add properties to the child prototype
Model.prototype.urlRoot = '//some/url';
// Set the magical __super__ property
Model.__super__ = Backbone.Model.prototype;
我们看到了什么?
他们看起来很相似不是吗?
CoffeeScript 只是 JavaScript。如果您已经在使用 Backbone 并且希望避免在__extends
生成的源代码中添加该函数,请使用Backbone.Model.extend
. 如果你想避免一起添加 Backbone,那么extends
实际上做同样的事情。这么多示例不使用后者的原因是 Backbone 不需要使用 CoffeeScript - 拥有一个依赖于外部库的示例是没有意义的。