设置DFS动画-在Javascript对象中使用setInterval和此选项时出现问题

我有一个HTML中的按钮网格，我想用它来设置深度优先搜索的动画，方法是在第一次访问按钮时更改按钮的颜色，然后在访问结束时更改按钮的颜色。我使用一个Javascript对象来处理所有逻辑，并使用递归DFS方法来构建一个类似于

[[animation\u function，grid\u coordinates]，…]的队列。然后我使用
setInterval
函数运行整个队列

问题是在运行
DFSGrid.animate（）
时，
DFSGrid
对象似乎已不存在？如果我
console.log（this）
在
DFSGrid.animate（）
中，则会出现
this
是指窗口对象？但是
这个
在所有其他方法中都可以正常工作

我对网络内容（以及Javascript）是新手，所以我非常困惑。我尝试了各种不同的方法，但我总是遇到一些问题，
this
或that（lol）在动画应该运行时未定义

我做错了什么


类DFSGrid{
构造函数（dfsGridElement）{
this.dfsGridElement=dfsGridElement
this.dirs=[[0，1]，-1，0]，[0，-1]，[1，0]]
this.visted=新集合（）
this.visted.add（'00'））
this.queue=[]
此参数为0.idx=0
}
dfs（i，j）{
如果（i>5 | | j>3）{
返回
}
常数coords=i.toString（）+j.toString（）
this.queue.push（[this.visit，coords]）
对于（让d表示这个。dirs）{
设[ni，nj]=[i+d[0]，j+d[1]]
让nextCoords=ni.toString（）+nj.toString（）
如果（0如此），我在上面遇到的问题在这里被描述为“这个
问题”：

使用
setInterval
时，被调用函数的
this
关键字将是
窗口
对象。解决此问题的方法是使用
function.prototype.bind


const startDFSAnimation=dfsGrid.animate.bind（dfsGrid）
startDFSAnimation（）
这指的是您定义的全局对象。在局部级别绕过它的一个简单方法是使用箭头函数而不是传统的函数定义。不确定您的意思……
这
应该指的是
DFSGrid
对象的所有方法，它指的是，但不是在
DFSGrid.animate（）中
当我用setInterval调用它的时候。你试过把它变成一个异步函数吗？也许它在调用
DFSGrid.animate（）之前就被执行了
method.Yep，这是您发现的问题的一个很好的通用解决方案。另一个需要考虑的技巧是在
构造函数中放入以下行：
this.animate=this.animate.bind（this）
。有了这一额外的行，您的旧代码应该可以工作。这与您的方法类似，但它隐藏在类中，我认为这很好。此外，如果您有多个
DFSGrid
类的实例，每个实例都将有自己正确绑定的
animate
方法，因此您不必担心还有其他问题，比如意外绑定到错误的实例。啊，是的，那更好。我还必须使用绑定来实现
visit
和
finish
函数，现在我可以把它们都放在构造函数中，这样它们就在一个地方了。谢谢您的输入！