web-dev-qa-db-ja.com

JavaScriptのオーバーライド関数

可能性のある複製:
JavaScriptプロトタイプを使用した基本メソッドの呼び出し

Javascriptの関数をオーバーライドするオブジェクトを継承したい。

基本メソッドを呼び出したいメソッドから。この場合、オブジェクトreaderPersonから継承し、関数getNameをオーバーライドしたいと思います。つまり、最初にPersonで関数を呼び出してから、いくつかの変更を行います。

<script>
    /* Class Person. */
    function Person(name) {
        this.name = name;
    }
    Person.prototype.getName = function() {
        return this.name;
    }

    var reader = new Person('John Smith');
    reader.getName = function() {
        // call to base function of Person, is it possible?
        return('Hello reader');
    }
    alert(reader.getName());
</script>
33
user1365697

プロトタイプではなくオブジェクト自体で関数を正しくオーバーライドしているため、オブジェクトでプロトタイプ関数を呼び出すことができます。

reader.getName = function() {
    var baseName = Person.prototype.getName.call(this);
    ...
}
29
Vincent Robert

ビンセントはあなたの直接の質問に答えましたが、Readerをさらに拡張できる真の継承階層を設定したい場合は、次のようにします。

パーソンクラスを作成します。

_function Person(name) {
    this.name = name;
}

Person.prototype.getName = function(){
    alert('Person getName called for ' + this.name);
    return this.name;
}
_

Readerクラスも作成します。

_function Reader(name) {
    // Calls the person constructor with `this` as its context
    Person.call(this, name);
}

// Make our prototype from Person.prototype so we inherit Person's methods
Reader.prototype = Object.create(Person.prototype);

// Override Persons's getName
Reader.prototype.getName = function() {
    alert('READER getName called for ' + this.name);
    // Call the original version of getName that we overrode.
    Person.prototype.getName.call(this);
    return 'Something';
}
Reader.prototype.constructor = Reader;
_

そして、VoraciousReaderなどでReaderを拡張するために、同様のプロセスを繰り返すことができます。

_function VoraciousReader(name) {
    // Call the Reader constructor which will then call the Person constructor
    Reader.call(this, name);
}

// Inherit Reader's methods (which will also inherit Person's methods)
VoraciousReader.prototype = Object.create(Reader.prototype);
VoraciousReader.prototype.constructor = VoraciousReader;
 // define our own methods for VoraciousReader
//VoraciousReader.prototype.someMethod = ... etc.
_

フィドル: http://jsfiddle.net/7BJNA/1/

Object.create: https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/Object/create

Object.create(arg)は、プロトタイプが引数として渡されたものである新しいオブジェクトを作成しています。

Editこの元の答えから何年も経ち、Javascriptはclassキーワードをサポートします。 JavaまたはC++。 https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Classes のような言語から

33

John Resigのこの手法を使用して、継承とメソッドのオーバーライドを取得します。 this._super()を呼び出して、オーバーライドされたメソッドにアクセスすることもできます。

http://ejohn.org/blog/simple-javascript-inheritance/

4
Absolom

これはそれを行う1つの方法です。

function Person(name) {
this.name = name;
}
Person.prototype.getName = function(){
return this.name;
}

var reader = new Person('John Smith');
reader.oldGetName = reader.getName;
reader.getName = function() {
//call to base function of Person , is it possible ?
    return this.oldGetName();
}
alert(reader.getName());​

http://jsfiddle.net/fXWfh/

3
Paddy