Hiërargie van ingeboude klasse in OOP in JavaScript

Ingeboude klasse het ook 'n hiërargie. Kom ons kyk na 'n voorbeeld van 'n paragraaf:

<p>teks</p>

Kry 'n verwysing na die paragraaf in 'n veranderlike:

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

Laat ons na ons paragraaf in die konsole kyk:

console.dir(elem);

Soos jy reeds weet, bevat die eienskap [[Prototype]] die naam van die klas van die paragraaf. Dit is HTMLParagraphElement. As jy die lys van eienskappe en metodes van hierdie klas uitvou, sal daar onderaan weer 'n eienskap [[Prototype]] wees, wat sal bevat reeds die ouerklas en dit sal HTMLElement wees. Vir dit kan ook 'n ouer gevind word en so voort.

Bestudeer die hiërargie van klasse vir hierdie etiket:

<div>teks</div>

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

Bestudeer die hiërargie van klasse vir hierdie etiket:

<input>

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

Bestudeer die hiërargie van klasse vir hierdie versameling:

<div>teks</div>
<div>teks</div>
<div>teks</div>

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

Bestudeer die hiërargie van klasse vir hierdie versameling:

<div>
	<p>teks</p>
	<p>teks</p>
	<p>teks</p>
</div>

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

console.dir(elems);