javascript - 扩展 JSON 结果以将 JavaScript 函数添加到每个 JS 对象

Question

我想知道是否有办法做到这一点，或者我是否走上了完全错误的道路，并且有更好的方法可以做到这一点。

所以我从服务器返回了一些数据，如下所示:

[{
  fieldId: 12,
  name: 'Client',
  provider: 'CompanyDataQuery'
},{
  fieldId: 11,
  name: 'Duration',
  provider: null
},{
  fieldId: 24,
  name: 'Brand',
  provider: 'BrandDataQuery'
}]

现在，每个对象都需要附加一个函数，该函数指示一组单独的数据应如何与其交互。

例如我有这样的东西:

{
  "$type": "EqualsExpression",
  "left": {
    "$type": "FieldNode",
    "fieldId": 12
  },
  "right": {
    "$type": "CompanyNode",
    "value": 829
  }
}

我想查看“left”表达式并获取值“12”，从第一个列表中找到相应的字段，然后向其询问数据。

var field = fields.find(node.left.fieldId);
var displayValue = field.getDisplayValue(node.right.value);

所以我想向该字段添加一个函数，例如:

{
  fieldId: 12,
  name: 'Client',
  provider: 'CompanyDataQuery',
  getDisplayValue: function(rightValue) {
     // Look up data based on CompanyDataQuery

     return companyDataQuery[rightValue].name;
  }
}

我知道这些函数的实现。但我不确定如何干净地扩展原始对象以包含此功能。

我应该迭代这些并根据需要分配函数还是为每个字段创建一个包装器......或者是否有更好的方法来做到这一点？

我想避免的是创建一个充满 if 语句的巨大函数，只是为了分配或决定调用哪些函数。

Answer 1

我推荐一个提供函数并保存数据的包装对象...您可以使其与 Backbone 非常相似，以保留一组通用的模式。

从包装对象本身开始:

var MyThing = function(data){
  this.data = data;
}

MyThing.prototype.doTheStuff = function(){
  // code to get the field data, and other data, here
};

MyThing.prototype.get = function(name){
  return this.data[name];
};

当你获取数据时，_.将其映射到你的包装对象

var listOfThingData = [ ... your list of things ... ];

var listOfThings = _.map(listOfThingData, function(thingData){
  return new MyThing(thingData);
});

此时，您有一个对象数组，每个对象都有 doTheStuff 方法。

var obj = listOfThings[0];
obj.doTheStuff();
obj.get("fieldId");
// etc.

从这里开始，您可能需要一个循环数组并通过 id 查找对象的方法。为此，我将在数组周围创建一个包装器。

var MyCollectionOfThings = function(things){
  this.things = things;
};

MyCollectionOfThings.prototype.get = function(id){
  var things = _.findWhere(this.things, {fieldId: id});
  // only return one of them, since it's by id
  if (things){ return things[0] };
};

这里将会有更多的代码...但我希望这应该能表达要点。

此外，此时您已经完成了 Backbone 集合和模型的一半:)