setInterval 函数不能使用外部变量

Question

为什么 prevColor 总是 undefined？

此代码应记录新颜色 (actualColor) 和以前的颜色 (prevColor)。但是我无法从 setInterval 函数内部保存到 prevColor 中。错误在哪里？我不认为这是上下文问题。但我不确定。里面没有this...

你能告诉我如何从 setInterval 函数内部将 actualColor 的值保存到 prevColor 中吗？

var actualColor;
var prevColor;


// do some user action and change actualColor


setInterval(function () {
    // only log the color if it differs from prevColor
    if (actualColor != prevColor) {
        console.log("actualColor: " + actualColor + ", prevColor: " + prevColor);
    }
    prevColor = actualColor;
}, 100);

控制台：

actualColor: acff06, prevColor: undefined

Answer 1

需要初始化prevColor的值，否则第一次会是undefined

随心所欲

var actualColor;
var prevColor = "";


// do some user action and change actualColor


setInterval(function () {
    // only log the color if it differs from prevColor
    if (actualColor != prevColor) {
        console.log("actualColor: " + actualColor + ", prevColor: " + prevColor);
    }
    prevColor = actualColor;
}, 100);

Answer 2

我认为这一定是你的上下文 - 我用你上面的所有内容制作了一个简单的网页，它工作正常 - 即使没有为变量设置初始值：

我把你的代码放在 HEAD 的脚本标签中，并添加了

<input
    type="text"
    id="actualColor"
    />
<input
    type="button"
    onclick = "actualColor = document.getElementById('actualColor').value;"
    value = "change colour" />

提供一种在网页中更改 actualColor 的方法（而不是使用控制台）

setInterval 函数不能使用外部变量

setInterval function cannot use outer variable

javascript

variables

setinterval