1. ホーム
  2. javascript

[解決済み] JavaScriptの継承。Object.createとnewの比較

2022-08-13 01:08:11

質問

JavaScriptでは、これらの2つの例の違いは何ですか。

前提条件

function SomeBaseClass(){
}

SomeBaseClass.prototype = {
    doThis : function(){
    },

    doThat : function(){
    }
}

Object.createを使った継承例A。

function MyClass(){
}

MyClass.prototype = Object.create(SomeBaseClass.prototype);

newキーワードを用いた継承例B

function MyClass(){
}

MyClass.prototype = new SomeBaseClass();

どちらの例も同じことを行っているように見えます。どのような場合にどちらかを選ぶのでしょうか?

追加の質問です。 以下のリンクのコード(15行目)を考えてみましょう。ここでは、関数自身のコンストラクタへの参照がプロトタイプに格納されています。なぜこれが有用なのでしょうか?

https://github.com/mrdoob/three.js/blob/master/src/loaders/ImageLoader.js

抜粋(リンクを開きたくない場合)。

THREE.ImageLoader.prototype = {

    constructor: THREE.ImageLoader
}

どのように解決するのですか?

ご質問の中で、以下のように述べられています。 Both examples seem to do the same thing とあるが、それは全く違う。

あなたの最初の例

function SomeBaseClass(){...}
SomeBaseClass.prototype = {
    doThis : function(){...},
    doThat : function(){...}
}
function MyClass(){...}
MyClass.prototype = Object.create(SomeBaseClass.prototype);

この例では、単に SomeBaseClass' prototype を継承しているだけですが、もし SomeBaseClass のように

function SomeBaseClass(){ 
    this.publicProperty='SomeValue'; 
}

のような使い方をすると

var obj=new MyClass();
console.log(obj.publicProperty); // undefined
​console.log(obj);​

obj オブジェクトには publicProperty のようなプロパティはありません。 この例では .

2つ目の例

MyClass.prototype = new SomeBaseClass();

を実行しているのです。 constructor のインスタンスを生成しています。 SomeBaseClass のインスタンスを作成し、全体の SomeBaseClass オブジェクトを継承します。ですから、もしあなたが

    var obj=new MyClass();
    console.log(obj.publicProperty); // SomeValue
    console.log(obj);​

この場合、その publicProperty プロパティも obj オブジェクトのように この例では .

というのは Object.create は一部の古いブラウザでは利用できないので、その場合は

if(!Object.create)
{
    Object.create=function(o){
        function F(){}
        F.prototype=o;
        return new F();
    }
}

上記のコードに Object.create という関数がない場合、その関数を使って Object.create 関数を使用することができます。 Object.create が実際に行っていることを説明していると思います。それが何らかの形で助けになることを願っています。