Question

我正在编写一个类项目（我们必须使用HTML5画布构建一个Frogger游戏）并且我有一堆对象可以帮助我解决碰撞检测，移动等不同的问题。

以下对象就是其中之一。每个视图都包含一个Frame对象，该对象包含一个函数调用hitTest，该函数调用以检查其帧是否与传入的帧冲突。出于某种原因，this.lr保留了游戏开始时最初设置的值，我无法弄清楚为什么它不会根据变化的原点进行更新。

function Frame(origin, size) {
    this.origin = utility.checkPoint(origin);
    this.size = utility.checkSize(size);
    var self = this;

    this.lr = (function () {
        return utility.checkPoint(new Point(self.origin.x + self.size.width, self.origin.y + self.size.height));
    }());

    this.tr = (function () {
        return utility.checkPoint(new Point(self.origin.x + self.size.width, self.origin.y));
    }());

    this.ll = (function () {
        return utility.checkPoint(new Point(self.origin.x, self.origin.y + self.size.height));
    }());

    /* Returns true if the two frames share any common pixels */

    this.hitTest = function (frame) {
        var isInXBounds = function (p) {
            return (p.x >= self.origin.x && p.x <= self.tr.x);
        };

        var isInYBounds = function (p) {
            return (p.y >= self.origin.y && p.y <= self.lr.y);
        };

        var isContained = function (p) {
            return (isInXBounds(p) && isInYBounds(p));
        };

        return isContained(frame.origin) || isContained(frame.tr) || isContained(frame.lr) || isContained(frame.ll);
    };
}

Answer 1

这就是我写Frame课程的方式：

Frame.prototype.lr = function () {
    var x = this.origin.x + this.size.width;
    var y = this.origin.y + this.size.height;
    return utility.checkPoint(new Point(x, y));
};

Frame.prototype.tr = function () {
    var x = this.origin.x + this.size.width;
    return utility.checkPoint(new Point(x, this.origin.y));
};

Frame.prototype.ll = function () {
    var y = this.origin.y + this.size.height;
    return utility.checkPoint(new Point(this.origin.x, y));
};

Frame.prototype.isContained = function (point) {
    var isInXBounds = point.x >= this.origin.x && point.x <= this.tr().x;
    var isInYBounds = point.y >= this.origin.y && point.y <= this.lr().y;
    return isInXBounds && isInYBounds;
};

Frame.prototype.hitTest = function (frame) {
    return this.isContained(frame.origin) || this.isContained(frame.tr) ||
           this.isContained(frame.lr) || this.isContained(frame.ll);
};

function Frame(origin, size) {
    this.origin = utility.checkPoint(origin);
    this.size = utility.checkSize(size);
}

原型继承对于来自古典背景的人来说可能是相当艰巨的。以下是原型继承的简单解释：https://stackoverflow.com/a/8096017/783743

有很多库可以帮助经典程序员使用JavaScript。例如我自己的augment库。以下是使用augment编写上述课程的方法：

var Frame = Object.augment(function () {
    this.constructor = function (origin, size) {
        this.origin = utility.checkPoint(origin);
        this.size = utility.checkSize(size);
    }

    this.lr = function () {
        var x = this.origin.x + this.size.width;
        var y = this.origin.y + this.size.height;
        return utility.checkPoint(new Point(x, y));
    };

    this.tr = function () {
        var x = this.origin.x + this.size.width;
        return utility.checkPoint(new Point(x, this.origin.y));
    };

    this.ll = function () {
        var y = this.origin.y + this.size.height;
        return utility.checkPoint(new Point(this.origin.x, y));
    };

    this.isContained = function (point) {
        var isInXBounds = point.x >= this.origin.x && point.x <= this.tr().x;
        var isInYBounds = point.y >= this.origin.y && point.y <= this.lr().y;
        return isInXBounds && isInYBounds;
    };

    this.hitTest = function (frame) {
        return this.isContained(frame.origin) || this.isContained(frame.tr) ||
               this.isContained(frame.lr) || this.isContained(frame.ll);
    };
});

另外，既然你想知道封闭真的是什么，我建议你阅读以下答案：https://stackoverflow.com/a/12931785/783743

Answer 2

您正在立即执行该功能

this.lr = (function () {
    return utility.checkPoint(new Point(self.origin.x + self.size.width, self.origin.y + self.size.height));
}());

因此，lr正在该点上被赋予一个值，并且永远不会改变。

你想要的只是：

this.lr = function () {
   return utility.checkPoint(new Point(self.origin.x + self.size.width, self.origin.y + self.size.height));
};

这将lr定义为方法，可以在将来根据需要调用。

Javascript对象值没有得到正确的值

2 个答案: