Применение let в цикле for для решения проблемы со счетчиком цикла

Пусть у вас есть набор DOM элементов, которые вы перебираете в цикле. И пусть вы хотите по клику на любой элемент вывести его порядковый номер. В этом случае вас может ждать подвох - все элементы будут выводить номер последнего элемента + 1, а не свой! В данном уроке я покажу вам, как применение let вместо var легко решит эту проблему.

Исходники кода

p {
	height: 20px;
	border: 1px solid red;
}

<p></p>
<p></p>
<p></p>
<p></p>
<p></p>

var elems = document.querySelectorAll('p');

for (let i = 0; i < elems.length; i++) {
	elems[i].addEventListener('click', function() {
		this.innerHTML = i;
	});
}

//console.log(i);