有人可以解释一下此JavaScript代码中发生了什么吗？
[英]can someone please explain what is happening in this javascript code?
问题描述
I want the browser to display the seconds since it was last refreshed. 
我希望浏览器显示自上次刷新以来的秒数。 I don't understand why Code 1 does not work; 我不明白为什么Code 1无法使用； Code 2 does; 代码2做到了； If code 1 does not work why does code 3 work? 如果代码1不起作用，为什么代码3起作用？ The setInterval call is similar in CODE 1 and CODE 3. The way the function is defined is different. setInterval调用在CODE 1和CODE 3中相似。该函数的定义方式不同。 But it is not clear to me why that is making a difference. 但是我不清楚为什么会有所作为。
Thanks very much for your help. 非常感谢您的帮助。 I have just started learning JavaScript. 我刚刚开始学习JavaScript。
CODE 1 代码1
<html>
<head>
<title>Time Since Refresh</title>
</head>
<body>
<br/>
<br/>
<span id="timeSinceStart"></span>
<script language="JavaScript">
var timeRefreshed = new Date();
function displayTimeSinceStart(){
var now = new Date();
//compute elapsed time
var elapsed = Math.round((now - timeRefreshed)/1000);
document.getElementById("timeSinceStart").innerHTML = "Time Elapsed: " + elapsed + " seconds.";
}
// Update seconds counter
setInterval(displayTimeSinceStart(), 1000);
</script>
</body>
</html>
CODE 2 Same as CODE 1, except the setInterval() function is written as CODE 2与CODE 1相同，但setInterval()函数的编写方式为
setInterval("displayTimeSinceStart();", 1000);
CODE 3 代码3
<html>
<head>
<title>Time Since Refresh</title>
</head>
<body>
<br/>
<br/>
<span id="timeSinceStart"></span>
<script language="JavaScript">
var timeRefreshed = new Date();
var timeSinceStart = {
displayTimeSinceStart: function(){
var now = new Date();
//compute elapsed time
var elapsed = Math.round((now - timeRefreshed)/1000);
document.getElementById("timeSinceStart").innerHTML = "Time Elapsed: " + elapsed + " seconds.";
}
}
// Update seconds counter
setInterval(timeSinceStart.displayTimeSinceStart, 1000);
</script>
</body>
</html>
2 个解决方案
解决方案1
7 已采纳 2011-12-16 03:10:35
Code 1 calls displayTimeSinceStart (because of the "()" ) instead of passing a reference to it: setInterval gets the return value of that function ( undefined ). 代码1 调用 displayTimeSinceStart （由于"()" ）而不是传递对其的引用： setInterval获取该函数的返回值（ undefined ）。 Drop the parentheses to fix. 删除括号以进行修复。
Code 2 passes a string for setInterval to evaluate: the parens are required since you want the method to be called when the interval times out. 代码2为setInterval传递了一个字符串setInterval值：间隔是必须的，因为您希望在间隔超时时调用该方法。
Code 3 passes a reference, equivalent to Code 1 without the "()" , so it works. 代码3传递了一个引用，等效于代码1，但没有"()" ，因此它可以工作。
setInterval expects a function reference (preferred), or a string that will be evaluated. setInterval需要一个函数引用（首选）或将要评估的字符串。
More details (including why sometimes a method call as a parameter to setTimeout makes sense) . 更多详细信息（包括为什么有时将方法调用作为setTimeout的参数是有意义的） 。
解决方案2
2 2011-12-16 03:20:02
In code 1 , change this line: 在代码1中 ，更改以下行：
setInterval(displayTimeSinceStart(), 1000);
to this: 对此：
setInterval(displayTimeSinceStart, 1000);
and it should update your time, once a second. 并且应该每秒更新一次您的时间。 You can see the fixed version work here: http://jsfiddle.net/jfriend00/sL7HN/ . 您可以在此处查看固定版本的工作： http : //jsfiddle.net/jfriend00/sL7HN/ 。
In code 2 , you are passing a string that will be sent to eval() upon each timer tick and that will correctly call the desired function. 在代码2中 ，您传递了一个字符串，该字符串将在每个计时器滴答时发送到eval() ，并将正确调用所需的函数。 This is not a desirable way to code. 这不是理想的编码方式。 Much better to just pass a reference to the function direction and not use a string and eval() . 只传递对函数方向的引用而不使用字符串和eval()更好。
In code 3 , you are passing a function reference (like my fixed version of code 1) that happens to be a property of an object so the function will be called on each timer tick. 在代码3中 ，您传递的函数引用（如代码1的固定版本）恰好是对象的属性，因此将在每个计时器滴答时调用该函数。
声明:本站的技术帖子网页，遵循CC BY-SA 4.0协议，如果您需要转载，请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.