JavaScript setInterval

Question

这是有关setInterval的教程示例，但它没有充分解释清楚，对于我这样的新手来说不够理解。希望您能回答以下问题：

i）1000毫秒计时器是否意味着moveElement函数将每秒触发一次？换句话说，它运行后会等待1秒钟，然后再次运行吗？

ii）moveElement的目的是每次运行将“redBox”向左移动10个像素吗？这就是为什么在函数中使用“px”的原因吗？

iii）在moveElement第一次运行后，新的x值（x + = 10）是否替换了var x = 0中的值？也就是说，它是否在程序顶部的变量x之外存储？

var x = 0;
setInterval(moveElement,1000);

function moveElement() {
  x+=10;
  var left = x + "px";
  document.getElementById("redbox").style.left=left;

- mjmitche

Answer 1

i) 理论上是可以的，JavaScript（大部分）单线程的特性意味着它不会完全达到1000ms。 ii) 它通过将左侧增加10px来将其向右移动10px。 Px是像素的缩写，即图片元素。 iii) x在函数外定义，因此每次调用时都保留。每次调用函数时，x都会增加10。如果x在函数内部定义，那么每次调用时都会为10。

- alex

Answer 2

i) setInterval函数每秒运行moveElement函数。如果是setTimeout函数，则只会在1秒后运行一次。

ii) 看起来是这样的。

iii) 在这种情况下，函数moveElement中没有声明变量x，因此它会尝试查找全局变量，在顶部找到了。因此，它将在函数外部存储新值x。

- Timothy Ruhle

---

这是错误的。它向左添加了10像素，因此将其向右推了10像素。 - alex

Answer 3

i) 这将帮助您理解setTimeout和setInterval：http://www.elated.com/articles/javascript-timers-with-settimeout-and-setinterval/

ii) "px"被添加（表示像素）以将有效属性值分配给具有单位“px”的"style.left"。

iii) 是的，它替换了该值，因为var x在函数外声明，因此是全局变量。

- DhruvPathak

---

那篇文章中有一些可怕的代码，即：setTimeout("setToBlack()", 2000);。 - alex