"document" は階層の中でどんなところでしょう?
重要性: 4
document
が属しているのはどのクラスでしょうか?
DOM 階層内でのその場所は何でしょう? What’s its place in the DOM hierarchy?
Node
や Element
、あるいは HTMLElement
から継承していますか?
このように出力することによって、どのクラスに属しているかを知ることができます。:
alert
(
document)
;
// [object HTMLDocument]
もしくは:
alert
(
document.
constructor.
name)
;
// HTMLDocument
したがって、document
は HTMLDocument
クラスのインスタンスです。
それは階層でどんなところでしょう?
仕様を見ることもできますが、手動で把握する方が早いでしょう。
__proto__
を使ってプロトタイプチェーンをたどりましょう。
ご存知の通り、クラスのメソッドはコンストラクタの prototype
にあります。例えば、HTMLDocument.prototype
は document のためのメソッドを持っています。
また、prototype
の内部にコンストラクタ関数への参照があります:
alert
(
HTMLDocument
.
prototype.
constructor ===
HTMLDocument)
;
// true
すべてのプロトタイプの組み込みクラスは constructor
参照があり、constructor.name
でクラスの名前を得ることができます。 document
プロトタイプチェーン内のすべてのオブジェクトに対してそれをやってみましょう:
alert
(
HTMLDocument
.
prototype.
constructor.
name)
;
// HTMLDocument
alert
(
HTMLDocument
.
prototype.
__proto__
.
constructor.
name)
;
// Document
alert
(
HTMLDocument
.
prototype.
__proto__.
__proto__
.
constructor.
name)
;
// Node
console.dir(document)
を使ってオブジェクトを調べ、 __proto__
を開くことでこれらの名前を見ることもできます。コンソールは内部的に constructor
からそれらを取り出します。