TypeScript/JavaScript中setInterval调用类方法时this指向异常报错求助

setInterval执行传入的回调函数时，会把回调的执行上下文绑定到全局对象，而非你的类实例，因此回调内部的this不指向类实例，自然找不到定义在类上的sortTargets方法，和构造函数的位置无关。

• 方案1：调用时包裹箭头函数
  箭头函数会继承外层作用域的this指向，可直接绑定类实例：

constructor () {
    this.intervalId = setInterval(() => this.checkLabelConflicts(), 1000);
}

• 方案2：显式绑定this
  通过bind方法把回调的this固定为当前类实例：

constructor () {
    this.intervalId = setInterval(this.checkLabelConflicts.bind(this), 1000);
}

• 方案3：定义类方法为箭头函数
  修改方法定义，让方法本身就绑定实例this：

private checkLabelConflicts = () => {
  this.sortTargets();
}

• 如果你的定时任务包含大量计算逻辑，怕阻塞主线程影响页面交互，可以使用Web Worker。你可以在Worker线程内独立运行定时逻辑，计算完成后通过postMessage接口把结果回传给主线程更新视图即可。
• 如果定时任务和页面渲染、动画相关，可以使用requestAnimationFrame，它的执行时机和浏览器刷新频率对齐，视觉流畅度更高。如果需要控制1秒执行一次，可在回调内加入时间戳判断做节流。

内容的提问来源于stack exchange，提问作者Nils T