204

私は自分の問題の解決策を見つけるために過去数時間を費やしましたが、どうしようもないようです.

基本的に、子クラスから親メソッドを呼び出す方法を知る必要があります。私がこれまでに試したすべてのことは、機能しないか、親メソッドを上書きすることになります。

次のコードを使用して、JavaScript で OOP を設定しています。

// SET UP OOP
// surrogate constructor (empty function)
function surrogateCtor() {}

function extend(base, sub) {
    // copy the prototype from the base to setup inheritance
    surrogateCtor.prototype = base.prototype;
    sub.prototype = new surrogateCtor();
    sub.prototype.constructor = sub;
}

// parent class
function ParentObject(name) {
    this.name = name;
}
// parent's methods
ParentObject.prototype = {
    myMethod: function(arg) {
        this.name = arg;
    }
}

// child
function ChildObject(name) {
    // call the parent's constructor
    ParentObject.call(this, name);
    this.myMethod = function(arg) {
        // HOW DO I CALL THE PARENT METHOD HERE?
        // do stuff
    }
}

// setup the prototype chain
extend(ParentObject, ChildObject);

最初に親のメソッドを呼び出してから、子クラスでさらにいくつかのものを追加する必要があります。

ほとんどの OOP 言語では、呼び出しと同じくらい簡単ですがparent.myMethod() 、javascript でどのように行われるかを本当に理解できません。

どんな助けでも大歓迎です、ありがとう！

4

9 に答える 9

231

その方法は次のとおりです。ParentClass.prototype.myMethod();

または、現在のインスタンスのコンテキストで呼び出したい場合は、次のようにできます。 ParentClass.prototype.myMethod.call(this)

引数を指定して子クラスから親メソッドを呼び出す 場合も同様です。 ParentClass.prototype.myMethod.call(this, arg1, arg2, ..)*ヒント:引数を配列として渡すapply()代わりに使用します。call()

于 2012-08-07T22:29:19.310 に答える
230

superES6 スタイルでは、キーワードなどの新機能を使用できます。superES6クラスの構文を使用している場合、キーワードはすべて親クラスのコンテキストに関するものです。非常に簡単な例として、チェックアウト:

注意:superインスタンス メソッド内のキーワードを介して親の静的メソッドを呼び出すことはできません。呼び出しメソッドも静的にする必要があります。

インスタンス メソッドによる静的メソッドの呼び出し - TypeError ! 

class Foo {
  static classMethod() {
    return 'hello';
  }
}

class Bar extends Foo {
  classMethod() {
    return super.classMethod() + ', too';
  }
}
console.log(Bar.classMethod()); // 'hello' - Invokes inherited static method
console.log((new Bar()).classMethod()); // 'Uncaught TypeError' - Invokes on instance method

経由の静的メソッドの呼び出しsuper- これは機能します!

class Foo {
  static classMethod() {
    return 'hello';
  }
}

class Bar extends Foo {
  static classMethod() {
    return super.classMethod() + ', too';
  }
}

console.log(Bar.classMethod()); // 'hello, too'

super呼び出しに基づいてコンテキストが変更されるようになりました - ほら！

class Foo {
  static classMethod() {
    return 'hello i am static only';
  }

  classMethod() {
    return 'hello there i am an instance ';
  }
}

class Bar extends Foo {
  classMethod() {
    return super.classMethod() + ', too';
  }
}

console.log((new Bar()).classMethod()); // "hello there i am an instance , too"
console.log(Bar.classMethod()); // "hello i am static only"

superまた、親コンストラクターを呼び出すために使用できます。

class Foo {}

class Bar extends Foo {
    constructor(num) {
        let tmp = num * 2; // OK
        this.num = num; // ReferenceError
        super();
        this.num = num; // OK
    }
}

そしてもちろん、それを使用して親クラスのプロパティにアクセスできますsuper.prop。だから、ES6を使って幸せになってください。

于 2016-12-27T13:55:13.540 に答える
2

Douglas Crockford のアイデアに基づいたものはどうでしょうか。

    function Shape(){}

    Shape.prototype.name = 'Shape';

    Shape.prototype.toString = function(){
        return this.constructor.parent
            ? this.constructor.parent.toString() + ',' + this.name
            : this.name;
    };


    function TwoDShape(){}

    var F = function(){};

    F.prototype = Shape.prototype;

    TwoDShape.prototype = new F();

    TwoDShape.prototype.constructor = TwoDShape;

    TwoDShape.parent = Shape.prototype;

    TwoDShape.prototype.name = '2D Shape';


    var my = new TwoDShape();

    console.log(my.toString()); ===> Shape,2D Shape
于 2015-04-14T17:16:32.423 に答える