javascript错误 - 无法从undefined中读取属性 - 但检查了未定义

Question

为什么我收到此错误？ “candlestick.actions”有时候是一个jsonarray，有时它是烛台下不存在的键（当天没有动作发生时），但是对烛台的检查应该可以防止这种情况发生 - 如果不是这样的话？在什么情况下会发生这种情况？

我认为描述这个的最好方法是使用这个图像。您可以看到应该阻止这种情况发生的条件，然后返回。如果candlestick.actions === undefined会返回，甚至可以达到candlestick.actions.length？

这是代码。这是我的“DrawCandlestick”功能的尾端。我只是想说Javascript不是多线程的，并且在我看来我不会在这个代码分支中的任何地方更改数组 - 但是对象变得未定义，但后来我意识到数组可能正在改变，因为在primefaces中的事件。这是一个接收新图形的xhtml页面，所以我可能在某种程度上间接改变了数组而不应该......不管怎样，道歉没有在第一时间发布代码，但我试图对我的问题非常具体。

if(candlestick.actions === undefined || !candlestick.actions || candlestick.actions === null ||
        candlestick.actions.length === undefined || !candlestick.actions.length)
    return;

for( var i = 0; i < candlestick.actions.length; i++) {

    var candlestick = candlestick.actions[i];

    if(candlestick.action === "BUY") {

        var leftOfArrow = centerX - this.candlestickColumnWidth / 2;
        var topOfArrow = lowY+1;
        var widthOfArrow = this.candlestickColumnWidth;
        var heightOfArrow = this.canvas.clientHeight * 0.05;
        this.drawArrowUp(this.canvasContext, leftOfArrow, topOfArrow, widthOfArrow, heightOfArrow, "blue", "black");
    }

    else if(candlestick.action === "SELL") {

        var leftOfArrow = centerX - this.candlestickColumnWidth / 2;
        var heightOfArrow = this.canvas.clientHeight * 0.05;
        var topOfArrow = highY-heightOfArrow-1;
        var widthOfArrow = this.candlestickColumnWidth;
        this.drawArrowDown(this.canvasContext, leftOfArrow, topOfArrow, widthOfArrow, heightOfArrow, "purple", "black");
    }
}

drawArrowDown函数只是一个画布绘制方法 - 而drawArrowUp基本上是相同的东西，但事情移动了一点点。

drawArrowDown(ctx, left, top, width, height, bkColor, borderColor) {

    var right = left+width;
    var bottom = top+height;
    var middle = left+(right-left)/2;

    ctx.beginPath();

    // top-middle peak, moving counter-clockwise around the arrow:
    ctx.moveTo(left, top);
    ctx.lineTo(middle, bottom);
    ctx.lineTo(right, top);

    // complete custom shape
    ctx.closePath();
    ctx.lineWidth = 1;
    ctx.fillStyle = bkColor;
    ctx.fill();
    ctx.strokeStyle = borderColor;
    ctx.stroke();
}

Answer 1

您正在通过定义它并在循环内为其指定不同的值来销毁candlestick对象。

var candlestick = candlestick.actions[i];

在循环中将其更改为另一个名称（不仅仅是定义）：

var candlestickAction = candlestick.actions[i];

然后：

if (candlestickAction.action === "BUY") {

其他事件也是如此。

注意：使用var声明会影响整个封闭函数，而不仅仅是循环块。