这个变量在传入回调函数时未定义

Question

我想通过以下this和mozilla website上的一个采用OOP方法。当我使用new关键字实例化我的函数/类时，图形呈现正确，但是当这个变量传入回调函数时，它变成undefined，我想知道是否有解决方法？

这里是我的代码：

function lineBasedCharts (renderTo, chartType, deviceID, metricType, refreshCycle, title, subtitle, yAxis, tooltip) { 
    this.mRenderTo = renderTo 
    this.mRefreshCycle = refreshCycle 
    this.mChartType = chartType 
    this.mTitle = title 
    this.mSubtitle = subtitle 
    this.mYAxis = yAxis 
    this.mTooltip = tooltip 

    ... 

    this.chart = new Highcharts.Chart(options, function (ch) { 
     //use a callback function off the end of highcharts, for when the chart has fully loaded. 
     AddSeries(ch, deviceID, metricType); 

     if (ch.series[0].data.length > 0) { 
      setTimeout(requestData, this.mRefreshCycle, ch, ch.series[0].data[ch.series[0].data.length - 1].x, deviceID, metricType, this.mRefreshCycle); 
     } 
    }); 
} 

，这是我如何实例化我的对象

var chart = [] 
chart.push(new lineBasedCharts('lineChart', 'spline', 49, 'TEMP', 30000, 'temp', 'Temp in degrees', 'Temperature (°C)', '°C')) 

this.mRefreshCycle似乎在回调函数中使用时必须变得不确定。

Answer 1

正如其他人所说的那样，我会删除“this”标识符并使​​用正在传入的参数。无论如何，它们都是相同的值，只要您没有更改mRefreshCycle的值晚些时候。如果你有一个这样做的增变器，那么你需要稍微调整一下。

如何使lineBasedChart成为一个实际的对象？

var LineBasedChart = function (renderTo, chartType, deviceID, metricType, refreshCycle, title, subtitle, yAxis, tooltip) { 
    var self = this; 
    this.mRenderTo = renderTo 
    this.mRefreshCycle = refreshCycle 
    this.mChartType = chartType 
    this.mTitle = title 
    this.mSubtitle = subtitle 
    this.mYAxis = yAxis 
    this.mTooltip = tooltip 

    ... 

    this.chart = new Highcharts.Chart(options, function (ch) { 
     //use a callback function off the end of highcharts, for when the chart has fully loaded. 
     AddSeries(ch, deviceID, metricType); 

     if (ch.series[0].data.length > 0) { 
      setTimeout(requestData, self.mRefreshCycle, ch, ch.series[0].data[ch.series[0].data.length - 1].x, deviceID, metricType, self.mRefreshCycle); 
     } 
    }); 

    /*Mutator to update refresh cycle value*/ 
    this.setRefreshCycle = function(refreshCycle) { 
     this.mRefreshCycle = refreshCycle; 
    } 
} 

这对于创建多个对象很有用，例如

var lineBasedChart1 = new LineBasedChart(...) 
var lineBasedChart2 = new LineBasedChart(...) 

你不一定需要使用你可以直接调用属性的增变器。

lineBasedChart1.mRefreshCycle = 500; 

Answer 2

改为将refreshCycle作为setTimeout的参数。使用this总是很危险，因为它会根据上下文改变意义。

Answer 3

this很可能是指您创建的Highcharts.chart对象。创建的this (_this = this)一个别名，并尝试使用_this.mRefreshCycle

function lineBasedCharts (renderTo, chartType, deviceID, metricType, refreshCycle, title, subtitle, yAxis, tooltip) { 
    //Add alias for this 
    _this = this; 
    this.mRenderTo = renderTo 
    this.mRefreshCycle = refreshCycle 
    this.mChartType = chartType 
    this.mTitle = title 
    this.mSubtitle = subtitle 
    this.mYAxis = yAxis 
    this.mTooltip = tooltip 

    ... 

    this.chart = new Highcharts.Chart(options, function (ch) { 
     //use a callback function off the end of highcharts, for when the chart has fully loaded. 
     AddSeries(ch, deviceID, metricType); 

     if (ch.series[0].data.length > 0) { 
      //change how you refer to mRefreshCycle 
      setTimeout(requestData, _this.mRefreshCycle, ch, ch.series[0].data[ch.series[0].data.length - 1].x, deviceID, metricType, this.mRefreshCycle); 
     } 
    }); 
} 

Answer 4

的范围“这个”内的回调函数是有可能的“新Highcharts.Chart”，而不是“lineBasedChart”功能。它不知道mRefreshCycle是什么，因为它不存在于新创建的对象的范围内。你可能只能删除'this'并利用闭包机制。

此外，传递给“new Highcharts.Chart（）”的“选项”未定义。

从我的手机发送此内容。我为缺乏降价道歉。当我有机会时，我会更新答案的格式。