更新JS类的属性基于其他属性
Updating properties of JS "class" based on other properties?
我对Javascript比较陌生,我正试图为我正在从事的游戏类型项目创建一个非常简单的物理引擎。为了做到这一点,我创建了我所理解的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
您正在更改一个属性,并期望其他属性更新,不幸的是,当属性保存原始值时,它不会这样工作。
当你设置一个值
时,你可以使用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
相关文章:
- chart.series[id].remove()无法刷新高位图表/高位股票中其他系列的图例属性
- 如何使用object.assign()从其他对象引用基本对象属性
- 对象获胜'如果qml中的其他地方定义了数字动画属性,则t设置动画
- 从其他元素上的单击事件访问image src属性
- 基本D3.js:如何将具有其他属性的数据绑定到元素
- 为数组元素的属性赋值将设置所有其他类似元素的属性
- 如何在 JavaScript 中访问函数中的其他属性值作为对象属性值
- 基于其他属性查询多维数组属性
- AngularJS:必需属性适用于某些字段,但不适用于其他字段
- 向ChartJS数据集添加其他属性
- 根据其他属性返回的值设置属性
- VueJS:检查属性是否具有来自其他属性的值
- 尝试分配只读属性,即使相同的命令在其他地方也有效
- 如何在EmberJS模板中访问存储在其他变量中的键中的对象属性的值
- 对象属性引用JavaScript中的其他对象属性
- 添加隐藏属性以存储其他属性值
- jquery在html属性中添加函数回调,以便在其他事件中调用
- 车把JS使用另一个属性的结果作为其他地方的名称
- 在环铆钉 js 中设置其他属性
- 如何设置我们从 JavaScript 中其他元素的属性返回的值 onclick 函数