var _a = document.querySelectorAll('.a'),
_b = document.querySelectorAll('.b');
for(var i = 0; i < _a.length; i++){
_a[i].addEventListener('click', function(){console.log( _b[i] ); },false);
_b[i].addEventListener('click', function(){console.log( _a[i] ); },false);
}
цикл идет 0 -> true, 1 - > true ... 3 - false( 3 < 3), потом когда вызывается функция console.log( _a[i]) оно ищет "i", находит собственно 3, а _a[3] у нас нет, только _а[0], _а[1], _а[2]
обратите внимание, что вы добавляете НЕ:
function(){console.log( _b[0] )
function(){console.log( _b[1] )
function(){console.log( _b[2] )
а:
function(){console.log( _b[i] )
function(){console.log( _b[i] )
function(){console.log( _b[i] )
и эту "i" оно ищет потом, при вызове.
Отвечаю на комментарий, для примера вот код:
var l = 3;
for (var i = 0, i < l; i = i + 1) {
console.log(i); //0, 1, 2
}
console.log('после цикла:' + i); //3
лучше всего запустите отладчик в консоле, и проследите все это...
происходит следующее, первый заход "и" , "и" меньше "л"(правда), увеличивается "и" на одни, но в скобки попадает старое значение....как то так если на пальцах...
тоесть, когда у вас выполняется 3 раз("и" == 2), оно увеличивает "и" на 1, то есть "и" == 3, но когда инструкция "и" меньше "л" не сработает, цикл дальше не пойдет, но и уже увеличена, потому что прибавление произошло в конце прошлого цикла.