В попытке изучить закрытие JavaScript я немного смутил себя.
Из того, что я собрал по сети, закрытие...
Объявление функции внутри другой функции, и эта внутренняя функция имеет доступ к своим родительским функциональным переменным даже после возвращения этой родительской функции.
Вот небольшой пример script из недавнего проекта. Он позволяет прокручивать текст в div с помощью кнопок вверх и вниз.
var pageScroll = (function() {
var $page,
$next,
$prev,
canScroll = true,
textHeight,
scrollHeight;
var init = function() {
$page = $('#secondary-page');
// reset text
$page.scrollTop(0);
textHeight = $page.outerHeight();
scrollHeight = $page.attr('scrollHeight');
if (textHeight === scrollHeight) { // not enough text to scroll
return false;
};
$page.after('<div id="page-controls"><button id="page-prev">prev</button><button id="page-next">next</button></div>');
$next = $('#page-next');
$prev = $('#page-prev');
$prev.hide();
$next.click(scrollDown);
$prev.click(scrollUp);
};
var scrollDown = function() {
if ( ! canScroll) return;
canScroll = false;
var scrollTop = $page.scrollTop();
$prev.fadeIn(500);
if (scrollTop == textHeight) { // can we scroll any lower?
$next.fadeOut(500);
}
$page.animate({ scrollTop: '+=' + textHeight + 'px'}, 500, function() {
canScroll = true;
});
};
var scrollUp = function() {
$next.fadeIn(500);
$prev.fadeOut(500);
$page.animate({ scrollTop: 0}, 500);
};
$(document).ready(init);
}());
В этом примере используются замыкания? Я знаю, что он имеет функции внутри функций, но существует ли случай, когда используются внешние переменные?
Я использую их, не зная об этом?
Спасибо
Update
Будет ли это делать замыкание, если я разместил это под оператором $(document).ready(init);
?
return {
scrollDown: scrollDown
};
Может быть, если бы я хотел, чтобы текст прокручивался из любого места в JavaScript, я мог бы сделать
pageScroll.scrollDown();
Другое обновление
Ничего себе, похоже, что это сработало! Вот код на JSbin. Обратите внимание, что скроллер страницы не работает точно в этом примере (он, похоже, не подходит к нижней части текста), но это нормально:) Бонусные баллы для всех, кто может сказать мне, почему он не прокручивается донизу.