Почему не сработал for in?

[slark]

Добрый день, создал функцию вызывающую модальное окно при нажатии по кнопке.

Решил для этого же сделать второю кнопку и чтобы не повторять код, в цикле кнопкам назначил событие вызывающее модальное окно:

const btnCalls = document.querySelectorAll('.btn')

for (let i = 0; i < btnCalls.length; i++) {
    btnCalls[i].addEventListener('click', function() {
        const a = 'Привет'
        const b = 'МИР!'

        console.log(`${a} ${b}`)
    })
}

Вопрос, почему через обычный цикл работает, а через for in не работает:

const btnCalls = document.querySelectorAll('.btn')

for (let btnCall in btnCalls) {
    btnCall.addEventListener('click', function() {
        const a = 'Привет'
        const b = 'МИР!'

        console.log(`${a} ${b}`)
    })
}

[рони]

slark,
вам не in нужен а of

[ksa]

почему через обычный цикл работает, а через for in не работает

Ответ, как всегда, в букваре...

Для перебора всех свойств из объекта используется цикл по свойствам for..in. Эта синтаксическая конструкция отличается от рассмотренного ранее цикла for( ; ; ).

https://learn.javascript.ru/object-for-in

Т.е. это разные циклы и они таки различаются, потому и разные результаты.

А "не работает" он у тебя потому, что ты не понимаешь что получаешь в том цикле.
Но он таки всегда работает как нужно

<div></div>
<script>
const a = document.querySelectorAll('div')

for (let k in a) {
	alert(k)
}
</script>

[ksa]

вам не in нужен а of

Потом выяснится что и тот цикл "не всегда работает"...