Каким образом должна использоваться функция с расширением массива с NodeLists в Babel?

Question

Я знаю, что querySelectorAll возвращает что-то вроде Массивного, но не совсем массива. Так что в моем коде я итерация над ним, используя синтаксис распространения ES6:

const things = document.querySelectorAll('.things'); 
[...things].forEach(thing => thing.do()); 

Если я пишу, что точный код в Chrome Devtools консоли, она работает, как ожидалось. Однако Столпотворение transpiling его ES5:

var things = document.querySelectorAll('.things'); 
[].concat(things).forEach(function(thing) { thing.do() }); 

[].concat(things)не делать то же самое, как [...things]. Ожидаемый результат - массив узлов, но concat возвращает массив NodeLists. Таким образом, вызов thing.do() приводит к ошибке, так как NodeList не имеет метода do.

Вместо этого ES5-удобный способ использования методов массива в NodeList состоял бы в том, чтобы сначала позвонить slice, например Array.prototype.slice.call(things).

Так что Вавилон неправильно переводить до concat для каждого использования массива? Или есть более новая версия или конфигурация, которые мне не хватает?

Answer 1

Вы можете установить @@isConcatSpreadable свойство на NodeList.prototype к true, чтобы сделать это правильно работать с [].concat.

NodeList.prototype[Symbol.isConcatSpreadable] = true; 
 
const divs = document.querySelectorAll('div'); 
 
console.log([].concat(divs));

<div>foo</div> 
 
<div>bar</div>