Хијерархија уграђених класа у ООП у JavaScript-у

Уграђене класе такође имају хијерархију. Хајде да погледамо на примеру параграфа:

<p>текст</p>

Узмимо референцу на параграф у променљиву:

let elem = document.querySelector('p');

Погледајмо наш параграф у конзоли:

console.dir(elem);

Као што већ знате, у својству [[Prototype]] налази се име класе параграфа. То је HTMLParagraphElement. Ако проширите листу својстава и метода ове класе, онда ћете на дну поново наћи својство [[Prototype]], које ће садржати већ родитељску класу и то ће бити HTMLElement. За њу такође можете наћи родитеља и тако даље.

Проучите хијерархију класа за овај таг:

<div>текст</div>

let elem = document.querySelector('div');
console.dir(elem);

Проучите хијерархију класа за овај таг:

<input>

let elem = document.querySelector('input');
console.dir(elem);

Проучите хијерархију класа за ову колекцију:

<div>текст</div>
<div>текст</div>
<div>текст</div>

let elems = document.querySelectorAll('div');
console.dir(elems);

Проучите хијерархију класа за ову колекцију:

<div>
	<p>текст</p>
	<p>текст</p>
	<p>текст</p>
</div>

let elem = document.querySelector('div');
let elems = elem.children;

console.dir(elems);