Why doesn't the spread operator return an array from the HTMLCollection?

Question

JavaScript

Good day!
There is the following: there is a collection of inputs that I want to translate into an array, so that later it will be possible to bypass it with higher-order functions. When used to translate into an array, the spread operator in TS returns the same collection, not an array. At the same time, in JS everything is ok with this, it is the array that is returned. What is the reason for this behavior?
https://jsfiddle.net/g31ubqet/

<input name="status"
             type="radio">
<input name="status"
             type="radio">
<input name="status"
             type="radio">

const collection = $('[name="status"]');
console.log(collection);
const spreadArray = [...collection];
const fromArray = Array.from(collection);
console.log(spreadArray);
console.log(fromArray);

The result of executing the code in TS:

< jQuery.fn.init(3) [input, input, input, prevObject: jQuery.fn.init(1)]
< jQuery.fn.init(3) [input, input, input, prevObject: jQuery.fn.init(3)]
< (3) [input, input, input]

The result of executing the code in JS:

< jQuery.fn.init(3) [input, input, input, prevObject: jQuery.fn.init(1)]
< (3) [input, input, input]
< (3) [input, input, input]

Googled that this might be related to target: "es5" in TS. Those. you just need to change the target in the TS configs?

Answer 1

this is connected with this
. And the object jQuery.fn.init(this is not HTMLCollection) has a slice method, the work of which we are observing.
the typescript compiles to different versions of js, and the spread appeared not so long ago.
try to change the target in compileOptions to tsconfig.json (didn't notice right away that you wrote this in the last sentence)