Question

请考虑代码：

// define the GameObject constructor function

    var GameObject = function(width, height) {
    this.x = Math.floor((Math.random() * myCanvasWidth) + 1);
    this.y = Math.floor((Math.random() * myCanvasHeight) + 1);
    this.width = width;
    this.height = height;
    return this;
};

// (re)define the GameObject prototype object

GameObject.prototype = {
    x: 0,
    y: 0,
    width: 5,
    width: 5,
    draw: function() {
        myCanvasContext.fillRect(this.x, this.y, this.width, this.height);
    }
};

然后我们可以将GameObject实例化100次。

var x = 100,
arrayOfGameObjects = [];
do {
    arrayOfGameObjects.push(new GameObject(10, 10));
    } while(x--);

现在我们有一个包含100个GameObjects的数组，它们共享相同的原型和draw方法的定义，这大大节省了应用程序中的内存。

当我们调用draw方法时，它将引用完全相同的函数。

var GameLoop = function() {
    for(gameObject in arrayOfGameObjects) {
        gameObject.draw(); // this is my problem. Is this correct? gameObject is simply and index who draw() method gets executed
    }
};

我的问题是使用方法draw（）执行的最后一行代码。由于gameObject只是一个索引，draw（）方法如何执行？该索引没有任何对象。它只是一个索引吗？

Here是一个链接

Answer 1

您应该对GameLoop：

使用以下内容

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

Answer 2

使用普通的for循环迭代数组。

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

在数组上使用for in循环实际上是不好的做法，因为它只是获取所需索引的一种方法。

Answer 3

我喜欢jquery $。每个

$.each(arrayOfGameObjects, function(i, gObject) {
    gObject.draw();
});

否则如其他人所描述的那样，使用来并使用数组长度进行迭代。

Answer 4

var GameLoop = function() {
    for(var i = 0, len = arrayOfGameObjects.length; i<len; i++) {
        gameObject.draw();
    }
};

在http://jsfiddle.net/SdBcx/2/

上查看此内容

一些注意事项：

在Array对象上使用for(obj in array)是不好的做法。原因是，如果您向Array.prototype添加自定义函数，自定义函数将出现在for循环中！我在这里写了一个例子：http://jsfiddle.net/BUp6T/
您可以看到我在arrayOfGameObjects.length变量中保存了len。在循环执行之前，这只发生一次。这比常见的解决方案要快得多：for(var i = 0; i < arrayOfGameObjects.length; i++)每次循环迭代都会检索数组长度。

循环原型的Javascript

4 个答案: