Вторая программа: «Сеньор Помидор» [25/25]

Курсы Знакомство с событиями
1

Помогите найти ошибку

Код

var pictures = [
‘gallery-tomato/tomato-red-large.jpg’,
‘gallery-tomato/tomato-yellow-large.jpg’,
‘gallery-tomato/tomato-strange-large.jpg’
];

var thumbnails = document.querySelectorAll(‘gallery__picture-previews’);
var fullPhoto = document.querySelector(‘full-picture’);

var addThumbnailClickHandler = function (preview, picture) {
preview.addEventListener(‘click’, function () {
fullPhoto.src = picture;
})
}

for (var i = 0; i < thumbnails.length; i++) {
addThumbnailClickHandler(thumbnails[i], pictures[i]);
}

1
1.PNG1902×969 262 KB

2

Если что в первых 2-ух переменных поставил точки, всё равно не работает.

3

Всё нашёл ошибку, у preview, лишнюю букву ‘s’ приписал.

4

Почему нельзя было рассказать про let? Ведь применении let вместо var в данном задании очень упрощает жизнь и никакое замыкание не надо.
var pictures = [
‘gallery-tomato/tomato-red-large.jpg’,
‘gallery-tomato/tomato-yellow-large.jpg’,
‘gallery-tomato/tomato-strange-large.jpg’
];
var allPhotos = document.querySelectorAll(’.gallery__picture-preview’);
var fullPhoto = document.querySelector(’.full-picture’);
for (let i = 0; i < allPhotos.length; i++) {
allPhotos[i].addEventListener(‘click’, function () {
fullPhoto.src = pictures[i];
});
}

5

ИМХО единственный + в том что теперь ты понимаешь с какими проблемами сталкнешся если будешь использовать var, ну и при чтении “старого” кода мб пригодиться

6
Моё решение с модулем:

…
let coll = document.querySelectorAll(’.gallery__picture-preview’);
let bigPhoto = document.querySelector(’.full-picture’);

for (let [i, len] = [0, coll.length]; i< len ; i++){
(index =>{
coll[index].addEventListener(‘click’, ()=> {
bigPhoto.src = pictures[index];
});
})(i);
};

1 лайк