Menu
Is there some difference between using Array.from(document.querySelectorAll('div')) or [...document.querySelectorAll('div')]?
Here is a example:
let spreadDivArray = [...document.querySelectorAll('div')]; console.log(spreadDivArray); let divArrayFrom = Array.from(document.querySelectorAll('div')); console.log(divArrayFrom); The console.log() will log the same result.
Is there any performance difference?
554
Syntax of Spread operator is same as Rest parameter but it works completely opposite of it. Syntax: var variablename1 = [... value];
The spread operator unpacks elements of iterable objects such as arrays, sets, and maps into a list. The rest paramter is also denoted by three dots (…). However, it packs the remaining arguments of a function into an array. The spread operator can be used to clone an iterable object or merge iterable objects into one.
Using the spread operator or the concat() method is the most optimal solution. If you are sure that all inputs to merge are arrays, use spread operator . In case you are unsure, use the concat() method. You can use the push() method to merge arrays when you want to change one of the input arrays to merge.
The main difference between rest and spread is that the rest operator puts the rest of some specific user-supplied values into a JavaScript array. But the spread syntax expands iterables into individual elements.
Well, Array.from is a static method, i.e., a function whereas the spread syntax is part of the array literal syntax. You can pass functions around like data, you can invoke them once, several times or not at all. This isn't possible with the spread syntax, which is static in this regard.
Note: Spread syntax effectively goes one level deep while copying an array. Therefore, it may be unsuitable for copying multidimensional arrays, as the following example shows. (The same is true with Object.assign () and spread syntax.) Array.prototype.concat () is often used to concatenate an array to the end of an existing array.
Spread syntax (...) allows an iterable such as an array expression or string to be expanded in places where zero or more arguments (for function calls) or elements (for array literals) are expected, or an object expression to be expanded in places where zero or more key-value pairs (for object literals) are expected.
Array.prototype.concat () is often used to concatenate an array to the end of an existing array. Without spread syntax, this is done as: With spread syntax this becomes: Array.prototype.unshift () is often used to insert an array of values at the start of an existing array.
Spread element (it's not an operator) works only with objects that are iterable (i.e. implement the @@iterator method). Array.from() works also on array-like objects (i.e. objects that have the length property and indexed elements) which are not iterable. See this example:
const arrayLikeObject = { 0: 'a', 1: 'b', length: 2 }; // This logs ['a', 'b'] console.log(Array.from(arrayLikeObject)); // This throws TypeError: arrayLikeObject[Symbol.iterator] is not a function console.log([...arrayLikeObject]);Also, if you just want to convert something to array, I think it's better to use Array.from() because it's more readable. Spread elements are useful for example when you want to concatenate multiple arrays (['a', 'b', ...someArray, ...someOtherArray]).
140
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
