How to pass an object property as a parameter? (JavaScript)

Question

I'm not sure if the title is appropriate for what I am trying to achieve

I am mapping JSON results to an array. Because I need to do this over and over again I would like to put the code into one function.

In the following examples I am repeating myself. I have properties called item.data1, item.data2 and in the second example item.something1, item.something2 ... How can I pass those properties as "general" arguments to the newly created function in order to use them there and not repeat myself to return those maps? The new function should be useable for the two examples below as well as for other cases where the properties could have different names.

service.getData(function(data) {
    var map = {};
    map = $.map(data, function(item, i) {
        var entry = {};

        entry.key = item.data1;
        entry.value = item.data2;

        return entry;
    });
});

service.getSomething(function(data) {
    var map = {};
    map = $.map(data, function(item, i) {
        var entry = {};

        entry.key = item.something1;
        entry.value = item.something2;

        return entry;
    });
});

return {key:item.something1, value:item.something2}

Bergi
– Bergi

2012-12-07 09:38:46 +00:00
Commented Dec 7, 2012 at 9:38 — Bergi
– Bergi, Commented Dec 7, 2012 at 9:38

Alex Wayne · Accepted Answer · 2012-12-07 09:33:06Z

65

use [] with a string to pull out properties from objects dynamically.

var a = { foo: 123 };
a.foo    // 123
a['foo'] // 123

var str = 'foo';
a[str]   // 123

Which means we can refactor your method like so, just pass in the names of the properties you want to read as strings.

var getKeyValueMap = function(data, keyPropName, valuePropName) {
  return $.map(data, function(item, i) {
    return {
      key:   item[keyPropName],
      value: item[valuePropName]
    }
  });
};

service.getData(function(data) {
  return getKeyValueMap(data, 'data1', 'data2');
});

service.getSomething(function(data) {
  return getKeyValueMap(data, 'something1', 'something2');
});

answered Dec 7, 2012 at 9:33

Alex Wayne

188k52 gold badges328 silver badges363 bronze badges

Sign up to request clarification or add additional context in comments.

3 Comments

Oscar Agreda Over a year ago

Thanks Alex. I am starting to think JavaScript came form allies is si powerful

LTroya Over a year ago

What if the key is one or two levels deep? How do you pass the key by parameter?

Alex Wayne Over a year ago

You just keep drilling in! obj[propA][propB][propC]

nozzleman · Accepted Answer · 2012-12-07 09:41:27Z

4

this can be done using the [] operators instead of the .-notation just like in this fiddle ive created just for you :D:

    var data = [{
        data1: 'foo',
        data2: 'bar',
        something1: 'sparky',
        something2: 'arf arf!'},
    {
        data1: 'My name is',
        data2: 'What?',
        something1: 'my name is',
        something2: 'Who?!'}
    ];

    function test(data, prop) {
        var d_length = data.length;
        for (var i = 0; i < d_length; i++) {
            alert(data[i][prop]);
        }
    }

    test(data, 'data1');

answered Dec 7, 2012 at 9:41

nozzleman

9,6794 gold badges42 silver badges60 bronze badges

Comments

Bergi · Accepted Answer · 2012-12-07 09:33:51Z

1

You will need to pass the item object and a map of item-keys to entry-keys. This could either be two arrays, an array of tuples or something, or an object. Most simple method I could think of is to change the descriptor object into the entry itself:

function mapPropertyNames(source, dest) {
    for (var prop in dest)
        dest[prop] = source[dest[prop]];
    return dest;
}

// and use it like this:

var map = $.map(data, function(item, i) {
    return mapPropertyNames(item, {key:"something1", value:"something2"});
});

answered Dec 7, 2012 at 9:33

Bergi

671k162 gold badges1k silver badges1.5k bronze badges

Comments

Raibaz · Accepted Answer · 2012-12-07 09:36:57Z

1

Something like

service.getData(function(data) {
    var map = {};
    var varNamePrefix = 'data';
    map = $.map(data, function(item, i) {
        return getProperties(item, varNamePrefix);
    });
});

service.getSomething(function(data) {
    var map = {};
    var varNamePrefix = 'something';
    map = $.map(data, function(item, i) {
        return getProperties(item, varNamePrefix);
    });
});

function getProperties(item, varNamePrefix) {
    var ret = {};
    ret.key = item[varNamePrefix + '1'];
    ret.value = item[varNamePrefix + '2'];
    return ret;
}

May help?

Basically, you could use a function that takes a property prefix and uses it to form the actual property names to get from items.

answered Dec 7, 2012 at 9:36

Raibaz

9,74010 gold badges49 silver badges71 bronze badges

Comments

dencey · Accepted Answer · 2012-12-07 09:39:09Z

-1

try this:

service.getData(function(data, props) {// props is a property object
    var map = {};
    map = $.map(data, function(item, i) {
        var entry = {};

        for (var key in props) {
            entry[key] = item[key]
        }

        return entry;
    });
});

or use a property array

service.getData(function(data, props) {// props is like ['data1', 'data2']
    var map = {};
    map = $.map(data, function(item, i) {
        var entry = {};

        for (var j = 0, k = props.length; j < k; j++) {
            entry[props[j]] = item[props[j]]
        }

        return entry;
    });
});

edited Dec 7, 2012 at 9:39

answered Dec 7, 2012 at 9:33

dencey

1,06117 silver badges26 bronze badges

4 Comments

Bergi Over a year ago

What exactly do you mean by "property object"?

dencey Over a year ago

@Bergi an object contain what properties needed, eg: {data1: 1, data2: 1}

Bergi Over a year ago

This does not work as "key" != "data1" - the OP wants the properties to be renamed. Btw, your array answer makes much more sense...

dencey Over a year ago

the key point is pass the properties to the function as a parameter and you can give different value every time, what type of the parameter is not important, choose one you think convenient

Collectives™ on Stack Overflow

How to pass an object property as a parameter? (JavaScript)

5 Answers 5

3 Comments

Comments

Comments

Comments

4 Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

5 Answers 5

3 Comments

Comments

Comments

Comments

4 Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related