JavaScript 类型问题:未捕获的类型错误:对象 0 没有方法“draw”

javascript type issue: Uncaught TypeError: Object 0 has no method 'draw'

本文关键字：类型 有方法 draw 对象 问题 JavaScript 错误      更新时间：2023-09-26

只是尝试使用 JS + canvas，我似乎碰壁了。我的最小应用程序的"目标"是单击画布上的任何随机位置，按下绘图按钮并在您单击的位置绘制正方形。

来自OO背景...我(尝试(使用 OO，在 js 中我没有完全掌握。

但基本上我有一个自定义的方形对象

function Square(l, w, x, y) {
    this.length = l;
    this.width  = w;
    this.posx   = x - l/2;
    this.posy   = y - w/2;
    //test
    //ctx.fillStyle = "rgb(20,0,0)";
    //ctx.fillRect(this.posx,this.posy,this.length,this.width);

    this.draw = function() {
        ctx.fillStyle = "rgb(20,0,0)";
        ctx.fillRect(this.posx,this.posy,this.length,this.width);
    }
}

每次用户单击时，我都会将其添加到数组中...这是我单击画布时的事件处理程序。

function addTo(evt) {
    pos = getMousePos(evt);
    var sq = new Square(50, 50, pos.x, pos.y);
    list.push(sq);
    output.innerText = "("+sq.posx+","+sq.posy+")";
}

这是我(尝试(绘制正方形的地方。

function renderStack() {
    //alert(list);
    canvas.width = canvas.width;
    for(var o in list) o.draw();
}

这是错误：

Uncaught TypeError: Object 0 has no method 'draw'

我在尝试访问该对象的变量时遇到类似的错误。似乎在我将它们添加到列表中后，js 忘记了它们是什么类型？- 因为当我打印数组时，它充满了 [对象对象] 的

谢谢。

>for ... in ...给你一个对象的键，而不是它的内容。

因此，在数组上，您将收到存储元素的索引和任何其他可枚举属性的名称。

相反，您应该使用：

for (var i = 0; i < list.length; ++i) {
     list[i].draw();
}

for(var o in list)

o是数组的索引(或属性(。您将通过 list[o] 访问该索引中存储的内容。

但是对于数组，最好使用 Alnitak 所示for循环而不是for-in 。

更新：

当您

需要遍历所有属性时，将使用 For-in。由于数组是一个对象，因此它具有索引和属性。因此，for-in 将遍历所有索引和属性。for-in 对对象更好。

例如

var obj = { p1: 1, p2: 2};
for(var prop in obj) {
   //...
}
相关文章：