Question

我开始注意到我的小游戏中表现不佳，因为我正在添加更多KO内容。

我有一个RessourcesVM，它包含AllRessources作为observableArray。此商店 MainRessource 对象包含名称，总数量，总容量，用于存储此资源的所有 Building 对象的列表。

示例：Rock和Wood在＆＃34; StorageBuilding＆＃34;中具有相同的Stockpile 构建对象。此Ressource对象存储在RessourcesVM的AllRessources observableArray中。

我试图创建一个显示资源数量的小型HUB。

在我的 MainRessource 对象中，我有这个pureComputed函数来计算，我决定在这里解析整个对象，以便更好地理解对象：

function MainRessource(data) {
  var self = this;

  self.Name = data.Name;
  self.IconCss = data.IconCss;

  //Incremented by the BuildingVM once the building's construction is completed
  self.TotalQte = ko.observable(isNaN(data.TotalQte) ? 0 : data.TotalQte);
  self.TotalCapacity = ko.observable(isNaN(data.TotalCapacity) ? 0 : data.TotalCapacity);


  self.ProductionRate = ko.observable(isNaN(data.ProductionRate) ? 0 : data.ProductionRate);
  self.getProductionRatePerSecond = ko.pureComputed(function() {
    var p = Game.app.cf.refreshEvery/self.ProductionRate();
    if(p > 0 && p != 'Infinity')
      return p;
    return 0;
  });

  if(data.StoredIn) { //TODO implement this properly
    self.StoredIn = data.StoredIn;
  } else {
    console.log("Warning: Ressource with name "+self.Name+" doesn't appear to have a StoredIn set.");
  }
  self.StorageBuildings = ko.observableArray([]);
  self.ProductionBuildings = ko.observableArray([]);

  self.OccupyingSpace = ko.observable(data.OccupyingSpace);


    self.getMaxCapacity = ko.pureComputed(function() {

      if(self.Name == "Energy") {
        //Energy is not "stored" in any buildings, return direct value
        var v = Math.floor(self.TotalCapacity());

      } else if(self.Name == "Wood") {
        //To calculate max wood capacity,, remove the space Rock occupies
        var r = Game.app.Ressources.AllRessources()[2];
        r = (r.TotalQte() / r.OccupyingSpace());

        var v = Math.floor((self.TotalCapacity()-r)/self.OccupyingSpace());

      } else if(self.Name == "Rock") {
        //To calculate max wood capacity,, remove the space Wood occupies
        var w = Game.app.Ressources.AllRessources()[1];
        w = (w.TotalQte() / w.OccupyingSpace());

        var v = Math.floor((self.TotalCapacity()-w)/self.OccupyingSpace());

      } else if(self.StoredIn == "FoodStorage") {
        var startWith = self.TotalCapacity(); //Total food capacity
        //For each Ressource that is stored in FoodStorage building type, remove the occupying space of that ressource
        for(var l = Game.app.Ressources.AllRessources.length, i = 0; i < l; i++) {
            //Skip the ressource we are calculating for
            if(Game.app.Ressources.AllRessources.StoredIn == 'FoodStorage' && Game.app.Ressources.AllRessources.Name != self.Name) {
              var w = Game.app.Ressources.AllRessources()[i];
              startWith -= (w.TotalQte() / w.OccupyingSpace());
            }
          }

          var v = Math.floor(startWith/self.OccupyingSpace());
      }

      if(isNaN(v) || v <= 0)
        return 0;

      return v;
    });

}

HUB的HTML代码如下：

<!-- ko with: Ressources -->
  <!-- ko foreach: AllRessources -->
  <div class="hub" >
    <i data-bind="css: IconCss"></i>
    <span data-bind="text: Math.floor(TotalQte())"></span>/<span data-bind="text: getMaxCapacity()"></span>
    (<span data-bind="text: getProductionRatePerSecond()"></span>) <span data-bind="meter: {value: TotalQte, max: TotalCapacity }" class="meter-sm"></span>
  </div>
  <!-- /ko -->
<!-- /ko -->

我知道pureComputed函数现在有点乱，我仍然试图找出最佳方法。

我应该在RessourcesVM中移动getMaxCapacity函数吗？这会给我带来一些性能上的好处吗？

有关逻辑的更多信息：您可以拥有多个库存，库存商店Wood和Rock。 Rock使用2个空格，木材使用1个（这就是为什么有这个＆＃34;前面代码中的OccupyingSpace的东西）你可以有多个粮仓，粮仓和Apple面包店。

我需要知道所有粮仓中有多少苹果以及所有粮仓的总容量。

感谢您的帮助

编辑在我的解释中将Ressource更改为MainRessource，以反映代码中提供的真实对象名称。

如何优化我的KnockoutJS pureComputed函数？

0 个答案: