递增对象内部变量

Incrementing variable inside object

我正在尝试使用函数增加对象内部变量的值。

这个有效

var player = {
  tech: 0,
  energy: 0
};

function getResource2(amount, id) {
  player.tech += amount;
  document.getElementById(id).innerHTML = player.tech;
}

window.setInterval(function() {
  getResource2(5, "Tech");
}, 1000);

而这不是

var player = {
  tech: 0,
  energy: 0
};

function getResource(resource, amount, id) {
  resource += amount;
  document.getElementById(id).innerHTML = resource;

window.setInterval(function() {
  getResource(player.tech, 1, "Tech");
}, 1000);

我不想重复我的代码太多。我想使用函数参数来定位对象内部的变量,而不是自己对其进行硬编码。

除了资源之外,您还可以通过将播放器传递给函数来解决此问题。然后你应该能够像这样增加目标资源:

player[resource] += amount;

整个函数看起来像这样:

function getResource(player, resource, amount, id) {
    player[resource] += amount;
    document.getElementById(id).innerHTML = player[resource];
}

那么你可以这样称呼它:

window.setInterval(function() {
    console.log("I'm working");
    getResource(player, 'tech' , 1, "Tech");
    console.log(player.tech);
}, 1000);

请注意 tech 作为字符串文字传递。

Sculper 已经提供了很好的答案,但我更喜欢以更面向对象的方式将逻辑保留在对象内部。

示例:

  var player = {
  tech: 0,
  energy: 0,

  getResource: function(amount, callback){
      this.tech += amount;

      if(callback)
          callback(this);
  }
};

var techResourceCallback = function(playerObject){
    var techElementId = 'Tech';
    document.getElementById(techElementId).innerHTML = playerObject.tech;
}

window.setInterval(function() {
  player.getResource(1, techResourceCallback);
}, 1000);