模块内的 JavaScript 范围问题
Javascript scope issue inside a module
当像下面的代码中一样声明时,$sessionTimeLeft
在updateSession()
内访问时是未定义的。但是当我$sessionTimeLeft
声明和赋值移动到initiate()
内部时,我得到了正确的jQuery对象。我想当$sessionTimeLeft
由于关闭而在initiate()
内部声明时,我可以访问它。但是为什么$sessionTimeLeft
超出了我的原始代码的范围呢?
var session = (function SessionManager() {
var timeLeftInMs;
var timeLeftInMin;
var delay; // in ms
var $sessionTimeLeft = $('#dcSessionTimeLeft');
/* Set up the module by setting the timeout and delay time. */
function initiate(_timeout, _delay) {
timeLeftInMin = _timeout;
timeLeftInMs = timeLeftInMin * 60 * 1000;
delay = _delay; // delay in ms
setInterval(updateSession, delay);
}
function updateSession() {
timeLeftInMs -= delay;
timeLeftInMin = timeLeftInMs / 60000; // convert ms to min.
$sessionTimeLeft.text(timeLeftInMin);
}
var publicAPI = {
initiate: initiate
};
return publicAPI;
})();
session.initiate(30,1000);
这里的问题是,当您尝试访问#dcSessionTimeLeft
时,它可能尚未加载。因此,确保加载它的一种方法是将代码包装在document.ready
中:
$(function() {
var session = (function SessionManager() {
var timeLeftInMs;
var timeLeftInMin;
var delay; // in ms
var $sessionTimeLeft = $('#dcSessionTimeLeft');
/* Set up the module by setting the timeout and delay time. */
function initiate(_timeout, _delay) {
timeLeftInMin = _timeout;
timeLeftInMs = timeLeftInMin * 60 * 1000;
delay = _delay; // delay in ms
setInterval(updateSession, delay);
}
function updateSession() {
timeLeftInMs -= delay;
timeLeftInMin = timeLeftInMs / 60000; // convert ms to min.
$sessionTimeLeft.text(timeLeftInMin);
}
var publicAPI = {
initiate: initiate
};
return publicAPI;
})();
session.initiate(30,1000);
});
在这种情况下,闭包也应该绝对有效。此代码不起作用的原因是您没有正确调用会话函数。请记住,此函数返回一个带有函数启动的对象
代码的最后一行应该是
session.initiate(30,1000);
这应该有效。为了重现问题,我使用了节点。我将 $sessionTimeLeft 变量更改为字符串 hello 并测试它是否仍然可以在 updateSession 函数中访问。我的代码是
var session = (function SessionManager() {
var timeLeftInMs;
var timeLeftInMin;
var delay; // in ms
var $sessionTimeLeft = "Hello";
/* Set up the module by setting the timeout and delay time. */
function initiate(_timeout, _delay) {
timeLeftInMin = _timeout;
timeLeftInMs = timeLeftInMin * 60 * 1000;
delay = _delay; // delay in ms
setInterval(updateSession, delay);
}
function updateSession() {
timeLeftInMs -= delay;
timeLeftInMin = timeLeftInMs / 60000; // convert ms to min.
console.log($sessionTimeLeft);
}
var publicAPI = {
initiate: initiate
};
return publicAPI;
})();
session.initiate(30,1000);
我得到的结果是
Hello
Hello
Hello
Hello
Hello
每 1 秒一次。
相关文章:
- setInterval游戏循环的范围问题
- firefox中的Javascript事件范围问题
- jQuery“this”范围问题
- 可以't在quizz页面范围问题上用最终分数更新变量
- JavaScript 函数变量范围问题
- 奇怪的可变范围问题
- AngularJS中的范围问题
- 如何在 JavaScript for D3.js 中解决这样的范围问题
- 我可以设置这个吗'某事'在该服务中动态创建的嵌套对象中的服务?(可能是范围问题)
- Angular.js的多个rest调用范围问题
- Angular-$http范围问题
- setTimeout范围问题
- NodeJS回调范围问题
- javascript函数的可变范围问题
- 可能存在Javascript范围问题
- 函数之间的Javascript变量范围问题
- 单击视图时的应用器范围问题
- 全球不断改变价值.可能通过引用或范围问题传递?帮助!链接中的详细示例
- 挖空 - 单击绑定到对象函数 - 范围问题
- Angular 在 http 请求后不更新页面(范围问题?