Object.create()はJavaScriptのプロトタイプ継承を実現するための重要なメソッドです。このメソッドを使うことで、既存のオブジェクトを元に新しいオブジェクトを作成できます。

Object.create()の基本的な使い方

Object.create()の基本的な構文は以下の通りです:

Object.create(proto[, propertiesObject])
  • proto: 新しく作成されるオブジェクトのプロトタイプとなるオブジェクト
  • propertiesObject: オプションのパラメータ。新しいオブジェクトに追加するプロパティを定義します

具体的な使用例

基本的な継承

const person = {
  greet() {
    console.log('こんにちは！');
  }
};

const student = Object.create(person);
student.study = function() {
  console.log('勉強中...');
};

student.greet(); // "こんにちは！"
student.study(); // "勉強中..."

プロパティの追加

const car = {
  type: 'vehicle'
};

const toyota = Object.create(car, {
  brand: {
    value: 'Toyota',
    writable: true,
    enumerable: true,
    configurable: true
  }
});

console.log(toyota.type);   // "vehicle"
console.log(toyota.brand);  // "Toyota"

Object.create()のメリット

1. クリーンな継承

  • 余分なプロパティを継承せずに、必要なものだけを引き継げます

2. プロトタイプチェーンの制御

  • プロトタイプチェーンを明示的に設定できます

3. nullプロトタイプオブジェクトの作成

const nullObject = Object.create(null);
// プロトタイプを持たない純粋なオブジェクトが作成されます

よくある間違いと注意点

1. プロトタイプとインスタンスプロパティの区別

const parent = { name: '親' };
const child = Object.create(parent);

console.log(child.name); // "親"
console.log(child.hasOwnProperty('name')); // false

2. プロパティの設定忘れ

// 誤った使用例
const obj = Object.create({}, {
  prop: { value: 42 }  // configurable, writable, enumerableが設定されていない
});

// 正しい使用例
const obj = Object.create({}, {
  prop: {
    value: 42,
    writable: true,
    enumerable: true,
    configurable: true
  }
});

ブラウザ対応状況

Object.create()は主要なモダンブラウザすべてでサポートされています。IE9以降のブラウザでも使用可能です。

以上が、Object.create()の基本的な使い方とポイントです。プロトタイプ継承を理解し、適切に使用することで、より柔軟なオブジェクト指向プログラミングが可能になります。