Я ищу перспективный способ перебора NodeList (т.е. из element.querySelectorAll(selector)
), а также совместимость с разными браузерами. Раньше я использовал функциональность ES6 Spread, однако IE не поддерживает распространение, поэтому вместо этого я использовал для этого прокладку. Я чувствовал, что это было немного излишним и неэффективным. Затем я наткнулся на хак Array.prototype.forEach.call
. Работает, но мне кажется вонючим.
Как лучше всего перебирать NodeList?
Я неравнодушен к обратной совместимости и чистому коду, но если ваш ответ также работает по любому из других критериев ниже, это будет оценено.
- Читабельность
- Защита будущего
- Скорость
Я просмотрел итерацию JavaScript через NodeList, в которой рассматриваются несколько методов. Тем не менее, нет проблем с читабельностью, совместимостью и т. д. Просто если это работает.
Вот несколько методов, с которыми я столкнулся:
const elems = document.querySelectorAll('img');
[].forEach.call(elems, function (o) { console.log(o) });
[...elems].foreach(function (o) { console.log(o) });
for (var i = 0; i < elems.length; i++) {
console.log(elems[i]);
}
for (var i = elems.length - 1; i >= 0; i--) {
console.log(elems[i]);
}
// User-defined
var forEach = function (array, callback, scope) {
for (var i = 0; i < array.length; i++) {
callback.call(scope, i, array[i]);
}
};
forEach(elems, function (index, value) {
console.log(index, value);
});
for
, но вы также можете использовать[].forEach.call
, что я считаю идиоматичным. 2. Я не ожидаю, что какой-либо из них будет удален в будущем, поэтому я не уверен, почему вы хотите, чтобы это было более надежным в будущем, чем то, что уже работает сегодня. Если он работает в IE и современных браузерах, он будет работать и через годы. 3. Скорость, скорее всего, не имеет значения. Я сомневаюсь, что какой-либо общий метод остановит ваше приложение. Простая итерация редко является узким местом — проблемы с производительностью обычно возникают в другом месте. - person VLAZ   schedule 11.12.2019