著名物理学，Uncaught TypeError

Question

下面的代码会产生这个错误：

Uncaught TypeError: Cannot read property '5' of undefined

这是由下面代码的第 52 行抛出的。当两个循环设置为停止在 4 时，我不明白 rows 或 cols 的值如何达到 5。

感谢您的帮助。

//globals define 
define(function(require, exports, module) {
    'use strict';
    // import dependencies
    var Engine = require('famous/core/Engine');
    var Surface = require('famous/core/Surface')
    var Modifier = require('famous/core/Modifier');
    var PhysicsEngine = require('famous/physics/PhysicsEngine');
    var Particle = require('famous/physics/bodies/Particle');
    var Drag = require('famous/physics/forces/Drag');
    var RepulsionForce = require('famous/physics/forces/Repulsion')

    var positionsArray = [-140,-70,0,70,140];

    var context = Engine.createContext();

    var physics = new PhysicsEngine();

    var planetParticle = new Particle({
        position:[0,0,0]
    });

    physics.addBody(planetParticle);

    var gridItem = [];
    var gridItemParticle = [];
    var gridItemModifier = [];


    for (var rows = 0; rows < 5; rows += 1){
        gridItem[rows] = [];
        gridItemParticle[rows] = [];
        gridItemModifier[rows] = [];
        for (var cols = 0; cols < 5; cols += 1){
           gridItem [rows][cols] = new Surface({
            properties: {
                backgroundColor: '#23AD23'
            }
            }); 

           gridItemParticle[rows][cols] = new Particle({
            position: [positionsArray[rows], positionsArray[cols], 0]
           });

           physics.addBody(gridItemParticle[rows][cols]);

           gridItemModifier[rows][cols] = new Modifier({
            size: [50,50],
            align: [0.5, 0.5],
            origin: [0.5, 0.5],

            //---------------------This is the line that throws the error
            transform: function() {
             return gridItemParticle[rows][cols].getTransform();
            }
           });

           context.add(gridItemModifier[rows][cols]).add(gridItem[rows][cols]);
        }
    }

});

Answer 1

转换函数已创建，但在此阶段未执行。

调用转换函数时，计数器确实是 5，这就是循环退出的原因。

示例：

rows = 0 - Loops (adds a transform function)
rows = 1 - Loops (adds a transform function)
rows = 2 - Loops (adds a transform function)
rows = 3 - Loops (adds a transform function)
rows = 4 - Loops (adds a transform function)
rows = 5 - Exits loop...

如果您现在调用其中一个函数，rows 的值为 5。

这是问题的一个简短示例：

var functionList = [];

for (var i = 0; i < 5; i++) {
    functionList.push(function () {
        alert(i);
    });
}

functionList[0]();

Answer 2

这实际上不是 Famo.us Physics 问题。您如何尝试将调用绑定到您的函数是一个问题。最佳做法是不要在循环中创建匿名函数。

rows 和 cols 的值需要绑定到您的函数以备后用。

        //---------------------This is the line that throws the error
        transform: function() {
         return gridItemParticle[rows][cols].getTransform();
        }

可以改为

        //--------------------- bind your values
        transform: gridItemTrans.bind({row: rows, col: cols})

在循环外创建一个函数

        function gridItemTrans() {
            return gridItemParticle[this.row][this.col].getTransform();
        }

著名物理学，Uncaught TypeError

Famous physics, Uncaught TypeError

javascript

famo.us