#
ドキュメント

Document

自分のための備忘録です。

参照

https://developer.mozilla.org/ja/docs/Web/JavaScript
まずはここを見る。

基本

  • prototypeプロパティ
  • constructorプロパティ
  • コンストラクタ

prototypeプロパティ

prototypeへのリンク

すべてのオブジェクトインスタンスは、インスタンスを生成したコンストラクタ関数のprototypeにリンクする秘密のプロパティ(__proto__)を持っています。この秘密のリンクを使ってインスタンスのコンストラクタ関数のprototypeプロパティを取得できます。

開眼!JavaScript 042

※ 「すべてのオブジェクトインスタンス」は、コンストラクタも含む。

// []は配列のリテラルコンストラクタ関数
const a = ['a', 'b'];
// __proto__は非推奨なので、かわりにObject.getPrototypeOf()を使用
// https://developer.mozilla.org/ja/docs/Web/JavaScript/Reference/Global_Objects/Object/proto
Array.prototype == Object.getPrototypeOf(a); // true
// クラスもカスタムコンストラクタ関数の糖衣構文
class Foo {};
const foo = new Foo();
Foo.protyotype === Object.getPrototypeOf(foo); // true

prototypeプロパティ

8.3 prototypeプロパティはすべてのFunction()インスタンスに自動的に付与される

開眼!JavaScript p111

  • ビルトインコンストラクタ関数(ArrayNumber)は、Function()のインスタンス
  • カスタムなコンストラクタ関数function Hoge() { /* コード */}は、Function()のインスタンス
  • classはコンストラクタ関数の糖衣構文
  • つまり↑よりすべてのコンストラクタ関数prototypeプロパティを持つ
// カスタムコンストラクタ関数
function Hoge() {};
Hoge.constructor === Function; // true
typeof Hoge.prototype;  // object
// クラス
class Foo {};
Foo.constructor === Function; // true
typeof Foo.prototype; // Object

そしてFunction()のインスタンスで自動的に付与されたprotypeプロパティの__proto__にはObjectが設定されている。

constructorプロパティ

コンストラクタを使って作成されたインスタンスには、オブジェクトを生成したコンストラクタ関数にポイントされたconstructorプロパティを持つ。

ref. 開眼!JavaScript 28

// 配列インスタンス
['a', 'b'].constructor == Array; // true
Array.constructor === Function;  // true
// クラス
class Foo {};
const foo = new Foo();
foo.constructor === Foo;
Foo.constructor === Function; 

コンストラクタリテラルとコンストラクタ関数

リテラル コンストラクタ関数
オブジェクト {} Object
数値 123 Number
真偽値 true or false Boolean
文字列 'foo' String
配列 [] Array
関数 なし Function
  • 数値、真偽値、文字列を除いてコンストラクタリテラルで作成されようがコンストラクタ関数で作成されようが機能は変わらない
  • 数値、真偽値、文字列はリテラルで作成された場合は、生成後にオブジェクトのように扱われる(メソッドを呼び出すなど)までプリミティブな値となる(開眼!JavaScript 15)

目次

リンク集

  • https://developer.mozilla.org/ja/docs/Web/JavaScript
  • https://nodejs.org/en/docs/
  • https://jsprimer.net/