VPF::Замыкание в цикле - интересный эффект

check

Дата 14.12.2008, 23:48 (ссылка)

(нет голосов)

Загрузка ...

Опытный

Профиль
Группа: Участник
Сообщений: 610
Регистрация: 3.4.2006

Репутация: нет
Всего: 23

Имеется какой-то DOM-элемент с id="main". У меня это <span>.
Мы хотим динамически навесить на него обработчики нескольких событий.

Если просто в цикле присваивать функцию соответствующему свойству-обработчику

Код


var items = ["click", "keypress"];

for (var i=0; i<items.length; i++) {
    
        var item = items[i];
        obj["on" + item] = function() {
            alert("Спасибо за ваш " + item);
        };
    
}

то при клике по span-у нам почему-то скажут "Спасибо за ваш keypress"

А вот если то же самое делать в анонимной функции

Код


var obj = document.getElementById("main");

var items = ["click", "keypress"];

for (var i=0; i<items.length; i++) {
    (function() {
        var item = items[i];
        obj["on" + item] = function() {
            alert("Спасибо за ваш " + item);
        };
    })();
}

то сообщение будет соответствовать событию.

Я понимаю, что в первом случае item является глобальной, но не понимаю, почему это дает такой результат.

check

Дата 15.12.2008, 12:17 (ссылка)

(нет голосов)

Загрузка ...

Опытный

Профиль
Группа: Участник
Сообщений: 610
Регистрация: 3.4.2006

Репутация: нет
Всего: 23

Кажется понял. В замкнутой функции, которая присваивается obj["on" + item], доступна именно переменная item, а не её значение на текущей итерации. Если мы создаем локальную область видимости оборачивая эту функцию другой анонимной функцией, то текущая итерация становится областью видимости, в которой замыкание видит переменную.
Если этого не сделать, то всем obj["on" + item] присвоится функция, в которой видна item c её последним значением.

Это сообщение отредактировал(а) check - 15.12.2008, 15:03

1 Пользователей читают эту тему (1 Гостей и 0 Скрытых Пользователей)
0 Пользователей:
« Предыдущая тема \| JavaScript: Общие вопросы \| Следующая тема »