Аргумент функции внутри цикла - можно?

[MC-XOBAHCK]

Здравствуйте!
Я не знаю как мне правильно сформулировать вопрос.
У меня такой код:

let butShag = document.querySelectorAll('.butShag');

for (let i = 0; i < butShag.length; i++) {
    butShag[i].addEventListener('click', function () {
        title(i); //Вот здесь i можно передавать?
    })
}

Можно ли так передавать индекс в title(i); ?
При клике на первую кнопку срабатывает, а на остальных даёт ошибку.
Или это недопустимо в JavaScript?

[ruslan_mart]

let butShag = document.querySelectorAll('.butShag');

for (let i = 0; i < butShag.length; i++) {
    butShag[i].addEventListener('click', function (i) {
        title(i);
    }.bind(butShag[i], i))
}

Но правильней будет вынести функцию обработчика, чтобы не создавать её каждый раз по новой.
А ещё правильней будет не использовать цикл, а использовать метод массива forEach, тогда и проблема с индексом отпадёт.

let butShag = document.querySelectorAll('.butShag');

function onClick(index, event) {
    title(index);
}

Array.prototype.forEach.call(butShag, (item, index) => item.addEventListener('click', onClick.bind(item, index));

[рони]

MC-XOBAHCK,
Пример ошибочного использования

[Alexandroppolus]

возможно, стоит подумать о делегировании

[рони]

А ещё правильней будет не использовать цикл, а использовать метод массива forEach,

[].forEach.call(document.querySelectorAll('.butShag'), function(node, index) {
   node.addEventListener("click", function() {
   title(index);
  })
});

[MC-XOBAHCK]

Спасибо всем за науку.
Для меня методы в предложенных решениях новЫ, я про них читал и видел, но никогда не использовал.
Вот видимо пришло время и повод чтобы их осваивать.