[FIXED] What type of data does querySelectorAll return?

Issue

A javaScript object does not have a length property, but the returned value of querySelectorAll has a length property, indicating that it's an array. But if we check it by Array.isArray() then it returns false, proving that it is not an array. What type of data is it then?

var obj1 = {
  fname: "Mirajul",
  lname: "Momin",
  age: 24
};
console.log(obj1.length);
var paraList = document.querySelectorAll("p");
console.log(paraList.length);
console.log(Array.isArray(paraList));

<p>This is paragraph one</p>
<p>This is paragraph two</p>
<p>This is paragraph three</p>
<p>This is paragraph four</p>

Solution

The Element method querySelectorAll() returns a static (not live) NodeList representing a list of the document's elements that match the specified group of selectors.

For the differences please visit: Difference between HTMLCollection, NodeLists, and arrays of objects

You can use Spread syntax to make that as an array:

var obj1 = {
  fname: "Mirajul",
  lname: "Momin",
  age: 24
};
console.log(obj1.length);
var paraList = [...document.querySelectorAll("p")];
console.log(paraList.length);
console.log(Array.isArray(paraList));

<p>This is paragraph one</p>
<p>This is paragraph two</p>
<p>This is paragraph three</p>
<p>This is paragraph four</p>

Answered By - Mamun

Answer Checked By - Mildred Charles (PHPFixing Admin)