Extend JSON result to add JavaScript Function to each JS object

Question

I'm wondering if there is a way to do this, or if I'm going down the completely wrong path and there's a better way to do this.

So I have some data returned from the server that looks something like this:

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

Now each of these objects needs to have a function attached to it which dictates how a separate set of data should interact with it.

For example I have something like:

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

I want to look at the 'left' expression and get the value '12', find the corresponding field from the first list, and then ask it for the data.

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

So I want to add a function to the field like:

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

     return companyDataQuery[rightValue].name;
  }
}

I know the implementation of these functions. But I'm unsure how to cleanly extend the original object to include this function.

Should I just iterate over these and assign the function as required or create a wrapper for each field... Or is there a better way to do this?

What I want to avoid is creating a giant function full of if statements just to assign or decide which functions to call.

Derick Bailey · Accepted Answer · 2014-11-07 13:56:37Z

I'd recommend a wrapper object that provides the functions and holds on to the data... you could make it very similar to Backbone, to keep a common set of patterns.

start with the wrapper object itself:


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];
};

when you get the data, _.map it in to your wrapper objects


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

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

at this point, you have an array of objects that each have the doTheStuff method.

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

from here, you might need a method that loops over your array and finds the object by id. i would create a wrapper around the array, for that.


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] };
};

There will be a lot more code, here... but this should get the point across, I hope.

Also, you're about halfway to Backbone's Collection and Model at this point :)

Collectives™ on Stack Overflow

Extend JSON result to add JavaScript Function to each JS object

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related