在构造函数之后运行其他操作

Run additional action after constructor

本文关键字:其他 操作 运行 之后 构造函数      更新时间:2023-09-26

是否可以更改构造函数,以便在创建对象后运行一些额外的操作。我尝试了类似的东西:

var origFoo = Foo
Foo = function() {
    origFoo.apply(this, arguments);
    /* extra actions */
}
Foo.prototype = new origFoo();

但这有几个问题,例如构造函数运行两次或更改原型链。

你离得很近。您应该将Foo.prototype分配给origFoo.prototype,以便获得相同的原型链。其他一切都很好!

例:

var Foo = function () {
    console.log('OriginalFoo');
};
Foo.prototype.method1 = function () {
    console.log('Method1');
};
OriginalFoo = Foo;
Foo = function () {
    OriginalFoo.apply(this, arguments);
    console.log('NewFoo');
};
Foo.prototype = OriginalFoo.prototype;
Foo.prototype.method2 = function () {
    console.log('Method2');
};
var x = new Foo();
x.method1();
x.method2();

演示:http://jsbin.com/ibatah/1/edit?js,console,output

PS:仍然存在类似静电属性(Foo.prop)的问题,但恐怕除了一次复制一个之外,我没有其他解决方案。

编辑:特殊构造函数的解决方案。

确实有一些构造函数不喜欢被称为函数,例如:Image 。要克服它,您可以在下面执行更笨拙的解决方案。您可以利用这样一个事实,即您可以从构造函数返回一个对象,它取代了使用 new 创建的对象。在被覆盖的构造函数中,调用方法时必须始终使用此新对象,而不是this

var Foo = function(a,b,c) {
  console.log('OriginalFoo',a,b,c);
};
Foo.prototype.prop1 = 'Property1';
Foo.prototype.method1 = function() {
  console.log('Method1', this.prop1);
};

OriginalFoo = Foo;
Foo = function(a,b,c) {
  var obj = new OriginalFoo(a,b,c);
  obj.init('Changed...'); // or this.init.call(obj,'Changed!'); 
  this.init('Not Changed'); // applies to a discarded object, has no effect
  console.log('NewFoo');
  return obj;
};
Foo.prototype = OriginalFoo.prototype;
Foo.prototype.prop2 = 'Property2';
Foo.prototype.method2 = function() {
  console.log('Method2', this.prop2);
};
Foo.prototype.init = function(param) {
  this.prop2 = param;
};

var x = new Foo('1','2','3');
console.log(x.prop1);
console.log(x.prop2);
x.method1();
x.method2();

演示:http://jsbin.com/ibatah/2/edit?js,console,output