最好的方法来创建一个新的构造函数依赖于一个旧的使用原型 [英] Best way to create a new constructor that relies on an old one using prototypes

问题描述

所以，假设我有下面的构造函数，其原型我已经这样修改：

So, suppose I have the following constructor function, whose prototype I have modified like so:

function foo(options) {
  this.propA_ = 'whatever';
  this.propB_ = 'something';
  this.propC_ = options.stuff;
  this.randomMethod = function omg() {
    /*code etc etc etc*/
  }
}

foo.prototype.p1 = 1;
foo.prototype.p2 = 2;

在我做foo之后，我想创建一个新的构造函数bar排序超级foo：它具有foo的所有属性，prototpye信息和方法，但它还有一些额外的属性和方法洒在上面。下面的代码是最优雅的方式来做这个？

After I have made foo, I want to create a new constructor, bar(), that is like a sort super foo: it has all of the properties, prototpye info, and methods of foo, but it ALSO has some extra properties and methods sprinkled on top. Would the following code be the most elegant way to do this?

function foo(options) {
  this.propA_ = 'whatever';
  this.propB_ = 'something';
  this.propC_ = options.stuff;
  this.randomMethod = function omg() {
    /*code etc etc etc*/
  }
}

foo.prototype.p1 = 1;
foo.prototype.p2 = 2;

function bar(options) {
  this = foo(options);
  this.propD_ = 'yet another thing';
  this.propE_ = options.moreStuff;
}

bar.prototype.p3 = 3;
foo.prototype.testing = 'A test';

smallObj = foo()'
bigObj = bar();

运行该代码后，这是我期望得到的

After running that code, here is what I would expect to get

console.log(a.p3); //3

bigObj.p2 = 100;
console.log(bigObj.p2); //100
console.log(foo.prototype.p2); //2

console.log(bigObj.randomMethod()); //Will work
console.log(smallObj.p3); //undefined
console.log(smallObj.propA_); //'whatever'
console.log(bigObj.propA_); //'whatever'

foo.prototype.propA_ = 'something totally different'
console.log(bigObj.propA_); //'something totally different'

这是一种正确的方式来构造函数，做出一种Foo Plus。基本上，我想foo​​继续工作，正如它在bar（）成立之前，但bar是一组属性和方法添加在foo的顶部。

Is this a correct way of "extending" the functionality of some existing constructor, to make a sort of "Foo Plus". Basically, I'd like for foo to continue to work exactly as it did before bar() came into existence, but for bar to be a set of properties and methods that are added on top of foo. Am I doing this right?

推荐答案

不知道为什么你有这么多的代码有原型继承。您可以使用 goog.inherit （和goog.base，如果您计划使用关闭编译器编译）从关闭库。

Not sure why you have so much code to have prototype inheritance. You can use something like goog.inherit (and goog.base if you plan to use closure compiler to compile) from the closure library.

下面是一些使用goog.inherit的示例代码：

Here is some sample code that uses goog.inherit:

var goog = {};
/**
 * Inherit the prototype methods from one constructor into another.
 * @param {Function} childCtor Child class.
 * @param {Function} parentCtor Parent class.
 */
goog.inherits = function (childCtor, parentCtor) {
    /** @constructor */
    function tempCtor() { };
    tempCtor.prototype = parentCtor.prototype;
    childCtor.superClass_ = parentCtor.prototype;
    childCtor.prototype = new tempCtor();
    childCtor.prototype.constructor = childCtor;
};
/** @constructor */
var GrandParent = function (arg1) {
    window['console'].log("grandparent constructor called with arg1:", arg1);
}
GrandParent.prototype.doSomething = function () {
    return "From GrandParent";
}
/** @constructor */
var Parent = function (arg1, arg2) {
    GrandParent.call(this, arg1);
    window['console'].log("parent constructor called with arg1:", arg1);
    window['console'].log("parent constructor called with arg2:", arg2);
}
goog.inherits(Parent, GrandParent);
/** @override */
Parent.prototype.doSomething = function () {
    return Parent.superClass_.doSomething() + " From Parent";
}
/** @constructor 
* @extends Parent */
var Child = function (arg1, arg2, arg3) {
    Parent.call(this, arg1, arg2);
    window['console'].log("child constructor called with arg1:", arg1);
    window['console'].log("child constructor called with arg2:", arg2);
    window['console'].log("child constructor called with arg3:", arg3);
}
goog.inherits(Child, Parent);
/** @override */
Child.prototype.doSomething = function () {
    return Child.superClass_.doSomething() + " From Child";
}

var c = new Child("arg1", "arg2", "arg3");
console.log(c.doSomething());

这篇关于最好的方法来创建一个新的构造函数依赖于一个旧的使用原型的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！