编辑

Question

我正在编写一个可以在Khan Academy上转换多边形的库，但是我一直收到这个错误：

Cannot read property 'x' of undefined

没有行号。

我的代码：

var Point = function(x,y) {
    this.x = x;
    this.y = y;
};

Point.prototype.rotate = function(around,degrees) {
    angleMode = "degrees";
    var aX = around.x;
    var aY = around.y;
    var cX = this.x;
    var cY = this.y;
    var dist = sqrt(sq(cX-aX)+sq(cY-aY));
    var currentTheta = asin(dist/cY);
    var gamma = degrees+currentTheta;
    this.x = cos(gamma)*dist+aX;
    this.y = sin(gamma)*dist+aY;
};

var Line = function(x1,y1,x2,y2) {
    this.f = new Point(x1,y1);
    this.s = new Point(x2,y2);
};

Line.prototype.draw = function() {
    line(this.f.x,this.f.y,this.s.x,this.s.y);
};

Line.prototype.rotate = function(around,degrees) {
    this.f = this.f.rotate(around,degrees);
    this.s = this.s.rotate(around,degrees);
};

var Polygon = function(x,y){
    if(x.length!==y.length){return;}
    this.sides = x.length;
    this.x = x;
    this.y = y;
    this.lines = new Array(this.sides);
    this.lines[0] = new Line(this.x[this.sides-1],this.y[this.sides-1],this.x[0],this.y[0]);
    for(var i=1;i<this.sides;i++){
        this.lines[i] = new Line(this.x[i-1],this.y[i-1]);
    }
};

Polygon.prototype.draw = function() {
    for(var i=0;i<this.sides;i++){
        this.lines[i].draw();
    }
};

Polygon.prototype.rotate = function(around,degrees) {
    for(var i=0;i<this.sides;i++){
        this.lines[i].rotate(around,degrees);
    }
};

var p = new Polygon([10,20,40],[40,20,15]);

var draw = function() {
    background(255,255,255);
    fill(0,0,0);
    stroke(0,0,0);
    p.rotate(new Point(20,20),1);
    p.draw();
};

然而，我仍然不知道它为什么会抛出错误，特别是因为它没有指出错误的位置。

编辑

链接到项目：Transformation Library

Answer 1

让我们从您的Point课程及其rotate()功能开始：

Point.prototype.rotate = function(around,degrees) {
    angleMode = "degrees";
    var aX = around.x;
    var aY = around.y;
    var cX = this.x;
    var cY = this.y;
    var dist = sqrt(sq(cX-aX)+sq(cY-aY));
    var currentTheta = asin(dist/cY);
    var gamma = degrees+currentTheta;
    this.x = cos(gamma)*dist+aX;
    this.y = sin(gamma)*dist+aY;
};

此函数执行一些数学运算并设置this.x和this.y变量。到目前为止一直这么好（免责声明：我没有检查过这个数学，但这不是重点）。但请注意此函数不会返回任何内容。

现在让我们转到您的Line课程及其rotate()功能：

Line.prototype.rotate = function(around,degrees) {  
   this.f = this.f.rotate(around,degrees);
   this.s = this.s.rotate(around,degrees);
};

这会将f和s变量设置为rotate()函数返回的值。但等等，rotate()类中的Point函数不会返回任何内容！现在，this.f和this.s 未定义！

您的Polygon班级调用Line班级rotate()功能时遇到类似问题。

因此，为了解决您的问题，您需要rotate()函数来返回某些内容，或者您只需要调用它们而不是期望返回值。

退后一步，我想知道你为什么要自己做这一切。 Processing有自己的rotate()函数，可以为您完成所有这些操作。你为什么不用它们呢？

可汗学院：无法读取未定义的属性

编辑

1 个答案: