dicem
@dicem

Почему функция возвращает данные последней итерации?

Вобщем, создаю новый DOM элемент
var div = d.createElement('div');
Пробовал добавлять функцию перед вставкой в document посредством:
div.onclick = function(){ 
			for (var j = 0; j < arr.length; j++) { 
				if (arr[j].id == i) { 
					var name = arr[j].name;
				}
			}
			alert('Div number is ' + i + '. Name is: ' + arr[j].name);
		}

Однако создавая циклично таким макаром объект и события для них, отрабатывает события с данными последней итерации.
Полный код:
(function(w, d, u) { 
	"use strict"; 

	var arr = [
		{
			id: 1,
			name: 'John'
		},
		{
			id: 2,
			name: 'Peter'
		},
		{
			id: 3,
			name: 'Kate'
		}
	]; 

	for (var i = 0; i < arr.length; i++) { 
		var div = d.createElement('div');
		div.onclick = function(){ 
			for (var j = 0; j < arr.length; j++) { 
				if (arr[j].id == i) { 
					var name = arr[j].name;
				}
			}
			alert('Div number is ' + i + '. Name is: ' + arr[j].name);
		} 
		div.style.cssText = 'width:30px;height:30px;border:1px solid red';
		d.body.appendChild(div); 
	} 
})(window, document, undefined)


Что я делаю не так и правильно ли я понимаю, что данным методом функцию не прикрепить?

UPD: Понял, что функции к конекчу верно, поэтому меняется суть вопроса.
  • Вопрос задан
  • 178 просмотров
Решения вопроса 2
Stalker_RED
@Stalker_RED
Вместо var i нужно let i
И читать "область видимости переменных"
Ответ написан
Комментировать
@MadridianFox
Web-программист, многостаночник
Вы создаёте замыкание, которое ссылается на переменную i. Ключевое слово "ссылается", т.е. функция обработчик не запоминает значение i на момент своего создания, а просто "знает", что где-то есть i. В момент выполнения любого обработчика i равно последнему индексу.
Ответ написан
Комментировать
Пригласить эксперта
Ответы на вопрос 1
jasonOk
@jasonOk
Легче болтать, чем код писать
Вместо div.onclick
div.addEventListener('click', function () {
...
Ответ написан
Комментировать
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы