根据其他属性更新 JS "class" 的属性？

Question

我是 Javascript 的新手，我正在尝试为我正在从事的游戏类型项目创建一个非常简单的物理引擎。为了做到这一点，我创建了我所理解的相当于 class 的 JS，我可以为我想要的每个对象创建新的副本。问题是我希望能够更新诸如 x 位置之类的值，并让它也更新诸如 x 中间位置（屏幕上对象的 x 中心）之类的东西。我知道这可以通过使用对象字面量和 getter 来实现，但是我希望能够根据屏幕上的内容实时创建新对象，但我不知道如何使用 get 来做到这一点工作。这是我正在尝试做的事情的总体思路：

var object = function (xPos, yPos, width, height) {
  this.xPos = xPos;
  this.yPos = yPos;
  function getXMid (xP) { return xP + width/2; }
  this.xMid = getXMid (this.xPos);
  function getYMid (yP) { return yP + height/2; }
  this.yMid = getYMid (this.yPos);
}

var ball = new object (10, 20, 50, 50);
ball.xPos = 50;
console.log (ball.xMid); // want this to output 75 instead of 45

Answer 1

您正在更改一个属性，并希望更新其他属性，不幸的是，当属性保持原始值时，它不会那样工作。

您可以在设置值时使用 setter 和 getter 以及一个函数来更新其他属性

var object = function(xPos, yPos, width, height) {
    this._xPos  = xPos;
    this._yPos  = yPos;
    this.recalc = function() {
     this.xMid = getXMid(this.xPos);
        this.yMid = getYMid(this.yPos);
    }
    
    Object.defineProperty(this, 'xPos', {
        get: function() {
            return this._xPos;
        },
        set: function(v) {
         this._xPos = v;
         this.recalc();
        }
    });

 Object.defineProperty(this, 'yPos', {
        get: function() {
            return this._yPos;
        },
        set: function(v) {
         this._yPos = v;
         this.recalc();
        }
    });
    
    function getXMid(xP) { return xP + width / 2; }
    
    function getYMid(yP) { return yP + height / 2; }
    
    this.recalc();
}

var ball = new object(10, 20, 50, 50);
ball.xPos = 50;
console.log (ball.xMid); // want this to output 75 instead of 45

根据其他属性更新 JS "class" 的属性？

Updating properties of JS "class" based on other properties?

javascript

class

get

physics-engine