为什么我的方法不承认我的对象的成员？

Question

我试图创建一个D3力图表中的“通用”类。当graphTick()函数被调用（或任何其他方法似乎...）类的成员值undefined好像方法不绑定到该实例。

我不知道如果我误解写一个类（我从C ++背景是），或者如果我滥用D3框架的JS方式。也许两者兼而有之？

我试图取代....

simulation.on("tick", this.graphTick)

...通过：

simulation.on("tick", function(){ 
    /*graphTick implementation*/ 
})

但后来它看上去就像是从D3一些匿名对象调用，所以我想我的问题很可能是更多关于JS语法。

有一个Codepen设置这个类和快速测试：https://codepen.io/mrelemental/pen/VGLNLa

Answer 1

您使用的是JavaScript类，这是在D3代码非常罕见。有一个在使用类本身没有问题，但你必须与this关键字时务请格外小心。

在你的代码的问题是，this函数内部graphTick的价值：在"tick"听众，this是仿真本身。按照API：

如果调度了指定的事件，每个侦听将与作为模拟的this上下文中调用。

你可以很容易地看到它自己，如果你做的函数内部console.log(this)。你会得到：

{tick: function, restart: function, stop: function, nodes: function, etc...}

这解释了为什么你都尝试没有成功：在两人面前，this是仿真本身。

解决方法很简单，只需传递正确的this到graphTick功能：

simulation.on("tick", this.graphTick.bind(this))