Question

我正在尝试为变量res创建方法。预期结果为res.add.wood('100')。这将增加100木材数量。 res.get.wheat()会得到小麦的数量。

资源是['wood'，'wheat'，'gold'，'meat']，动作是['get'，'set'，'add'，'sub']。我不打算按如下方式定义所有这些：

var resources = ['wood', 'wheat', 'gold', 'meat'];
var actions = ['get', 'set', 'add', 'sub'];

var res;

function res.get.wood() {
  //
}

function res.set.wood() {
  //
}

// 6 more to define.....

我希望找到一种方法让它更快。

以下代码可让我使用res.get()，res.set()，res.add()和res.sub()：

var res = ['get', 'set', 'add', 'sub'];

res.forEach(function(arrayElement) {

  res[arrayElement] = function() {
    alert(arrayElement)
  }

});

我需要另一个循环，我尝试了以下但是它不起作用：

res.forEach(function(arrayElement) {

  ['get', 'set', 'add', 'sub'].forEach(function(arrayInnerElement) {

    res[arrayElement][arrayInnerElement] = function() {
      alert(arrayInnerElement);
    }

  });
});

Answer 1

我建议这样的事情：

var resources = { 'wood': 50, 'wheat': 100, 'gold': 0, 'meat': 50 };

var resourceManager = (function(resources) {

  function Resource(amount) {
    this.amount = amount || 0;
  }
  Resource.prototype.get = function() {
    return this.amount;
  };
  Resource.prototype.set = function(amount) {
    this.amount = amount;
  };
  Resource.prototype.add = function(amount) {
    this.amount += amount;
  };
  Resource.prototype.sub = function(amount) {
    this.amount -= amount;
  };

  var o = {};
  Object.keys(resources).forEach(function(resource) {
    o[resource] = new Resource(resources[resource]);
  });
  return o;

}(resources));


var res = resourceManager;
console.log(res.wood.get()); // 50
res.wood.set(10);
console.log(res.wood.get()); // 10
res.wood.add(5);
res.wood.sub(2);
console.log(res.wood.get()); // 13

Answer 2

如果您有一个退出函数来处理所有操作（例如执行API调用）并且只想要一个更好的界面，您可以使用ES5 Array.prototype.reduce创建res对象：

function resource_action(resource, action, amount) {
  console.log(resource, action, amount);
};

var resources = ['wood', 'wheat', 'gold', 'meat'];
var actions = ['get', 'set', 'add', 'sub'];

var res = resources.reduce(function(res, r) {
  res[r] = actions.reduce(function(act, a) {
    act[a] = function(amount) {
      return resource_action(r, a, amount);
    };
    return act;
  }, {})
  return res;
}, {});

res.gold.add(10);

Answer 3

只需将原型对象设置为新对象并在那里定义即可。

function Item () {
    this.get = function () {alert("got me");}
    this.set = function () {}
    this.add = function () {}
    this.sub = function () {}
  }


  function Wood () {

  }

  Wood.prototype = new Item ();

然后你所要做的就是：

 var newWoodItem = new Wood();

如果你需要覆盖其中一个方法。

 function Wood () {
    this.get = function () {alert("i am the new method.");}
 }

Answer 4

我会这样做“jQuery样式”，其功能类似于$(el).css('color','red')：

// Create a Stock Object
var res = new Stock();

// Play with it
console.log( res.get('wood')     );  // 0
console.log( res.set('wood', 10) );  // 10
console.log( res.get('wood')     );  // 10
console.log( res.add('wood', 5)  );  // 15
console.log( res.sub('foo', 5)   );  // false (undefined resource)


function Stock() {
    var resource_types = ['wood', 'wheat', 'gold', 'meat'],
        resources = {};

    init();

    function init() {
        for(var i=0; i<resource_types.length; i++) {
            resources[ resource_types[i] ] = 0;
        }
    }

    function add(resource, value) {
        if(is_resource(resource)) {
            resources[ resource ] += parseFloat(value);
            return resources[ resource ];
        }
        return false;
    }

    function sub(resource, value) {
        if(is_resource(resource) && parseFloat(value) <= resources[ resource ]) {
            resources[ resource ] -= parseFloat(value);
            return resources[ resource ];
        }
        return false;
    }

    function set(resource, value) {
        if(is_resource(resource)) {
            resources[ resource ] = parseFloat(value);
            return resources[ resource ];
        }
        return false;
    }

    function get(resource) {
        if(is_resource(resource)) {
            return resources[ resource ];
        }
        return false;
    }

    function is_resource(str) {
        return resource_types.indexOf(str) > -1;
    }

    return {
        add: add,
        sub: sub,
        set: set,
        get: get
    };
}

在forEach（）中创建方法;

4 个答案: