Итераторы
Давайте рассмотрим, какой способ перебора элементов будет максимально быстрым в JavaScript. У нас есть несколько возможностей для реализации цикла, ниже приведен полный вариант кода для тестирования.
// выбираем все элементы из DOM-дерева
var items = document.getElementsByTagName("*");
// кэшируем текущий размер DOM-дерева
var length = items.length;
// запоминаем текущий момент времени
var time = new Date().getTime();
// запускаем первый тест, обычный перебор элементов массива,
// запускается 10000 раз
for (var j=0; j<10000; j++) {
for (var i=0; i var item = items[i]; } } // выводим результат в подготовленный выше контейнер document.getElementById('test1').innerHTML = "Простой цикл: " + (new Date().getTime() - time); time = new Date().getTime(); // кэшируем размер массива for (var j=0; j<10000; j++) { for (var i=0; i var item = items[i]; } } document.getElementById('test2').innerHTML = "Простой цикл (с кэшированием): " + (new Date().getTime() - time); time = new Date().getTime(); // встроенный for-in итератор для объекта массива for (var j=0; j<10000; j++) { for (var i in items) { var item = items[i]; } } document.getElementById('test3').innerHTML = "Простой через for-in: " + (new Date().getTime() - time); time = new Date().getTime(); // обратный перебор элементов массива for (var j=0; j<10000; j++) { for (var i = length - 1; i >= 0; i--) { var item = items[i]; } } document.getElementById('test4').innerHTML = "Обратный: " + (new Date().getTime() - time); time = new Date().getTime(); // итератор do-while for (var j=0; j<10000; j++) { var i = 0; do { var item = items[i]; i++; } while (i < length) } document.getElementById('test5').innerHTML = "do-while: " + (new Date().getTime() - time); time = new Date().getTime(); // обратный while (самый быстрый) for (var j=0; j<10000; j++) { var i = length - 1; while (--i) { var item = items[i]; } } document.getElementById('test6').innerHTML = "Обратный while: " + (new Date().getTime() - time); В результате мы получим примерно следующую таблицу (табл. 7.3).