Почему мой js вызывает появление последнего изображения массива перед переходом к представлению?

Question

На данный момент мой код успешно переходит от одного изображения к другому после нажатия на него.

Однако проблема, с которой я сталкиваюсь, заключается в том, что, как только вы доберетесь до последнего изображения и нажмете (чтобы перенаправить пользователя на indexTwo.html), пользователь вернется к первому изображению примерно на 2 секунды, а затемон перенаправляет на indexTwo.html.

Мой вопрос: как бы я мог предотвратить такое поведение?Другими словами: кликните по всем изображениям, и после того, как последнее изображение будет щелкнуто, перенаправьте пользователя на indexTwo.html, не видя первого изображения вообще.

Примечание: я знаю, что оператор if (imageId === 0) {...} является виновником, но не уверенкак это исправить?

let theImage = document.getElementById('the-image');

let index = [
    "http://tech21info.com/admin/wp-content/uploads/2013/03/chrome-logo-200x200.png",
    "https://cdn.tutsplus.com/net/uploads/legacy/155_drupal/200x200.png",
    "https://townandcountryremovals.com/wp-content/uploads/2013/10/firefox-logo-200x200.png"
];

let op = 1;
let imageId = 0;

let clickedImage = () => {
    // start animation opacity
    if(op === 1) {
        let timer = setInterval(() => {
            if(op <= 0.1) {
                // load the next image
                imageId = (1 + imageId) % index.length;
                theImage.src = index[imageId];

                // reset the opacity
                theImage.style.opacity = op = 1;
                clearInterval(timer);

                if (imageId === 0) {
                    window.location = "indexTwo.html";
                }

            } else {
                op -= 0.1;
                theImage.style.opacity = op;
            }
        }, 50)
    }
};

Answer 1

вам нужно проверить соответствие типов данных для imageId и числа 0?если нет, попробуйте использовать == вместо ===