Property access of object within an array using a variable in Javascript

Question

I am trying to access a property of an object which is within an object in an array. Quite the mouthful. The catch is that I want to do this using a variable. Its probably easier if i explain with code;

var array= [
  { id: 0, client: { id:0, clientName: "John" }},
  { id: 1, client: { id:1, clientName: "Tom" }}
]
console.log(array[0][client][clientName]); // Displays correctly

So the above code works as expected using the brackets notation. But as I said earlier I need to use a Variable like this example;

var array= [
  { id: 0, client: { id:0, clientName: "John" }},
  { id: 0, client: { id:0, clientName: "John" }}
]
var property = "client.clientName";
console.log(array[0][property]); // Does not work

I understand why this code wouldn't work but really this is more of a pseudo code to explain what I am trying to achieve!

or use something like https://github.com/jayway/JsonPath – CupawnTae Jan 24 '17 at 14:43 — CupawnTae, Jan 24 '17 at 14:43

score 1 · Answer 1 · answered Jan 24 '17 at 14:40

var array= [
  { id: 0, client: { id:0, clientName: "John" }},
  { id: 0, client: { id:0, clientName: "John" }}
]
var property = "client.clientName",
    getPropByString=function(data,val){
      val=val.split(/\./g);
      var dataApp=data;
      val.forEach(function(prop){
        dataApp=dataApp[prop];
      });
      return dataApp;
    };
console.log(getPropByString(array[0],property));

score 1 · Accepted Answer · answered Jan 24 '17 at 14:42

1

That you can't get it like that way instead split and get nested properties. Use Array#reduce method to get the nested property by splitting the property string using String#split method.

// split the string and iterate over the result array
property.split('.').reduce(function(o, p) {
  // check object defined and return nested property value
  return o && o[p];
  // set initial value as the object where you need to fetch data
}, array[0])

var array = [{
  id: 0,
  client: {
    id: 0,
    clientName: "John"
  }
}, {
  id: 0,
  client: {
    id: 0,
    clientName: "John"
  }
}]

var property = "client.clientName";
console.log(
  property.split('.').reduce(function(o, p) {
    return o && o[p];
  }, array[0])
);

answered Jan 24 '17 at 14:42

Pranav C Balan

113,687
23
165
188

1

Hey! Pretty good one, storing it for later :D – Sir McPotato Jan 24 '17 at 15:01
1

Hey bro, this is just what I needed thank you! – Oliver Furmage Jan 24 '17 at 17:02
@OliverFurmage : glad to help you :) – Pranav C Balan Jan 24 '17 at 17:03

Nina Scholz · Answer 3 · 2017-01-24T14:45:16.010

0

You could use a function, which splits the string with the property names and reduce the given object.

function getValue(object, path) {
    return path.split('.').reduce(function (o, k) {
        return (o || {})[k];
    }, object);
}

var array = [{ id: 0, client: { id:0, clientName: "John" } }, { id: 1, client: { id:1, clientName: "Tom" } }],
    property = "client.clientName";

console.log(getValue(array[0], property));

edited Jan 24 '17 at 14:45

answered Jan 24 '17 at 14:40

Nina Scholz

376,160
25
347
392

2

From the question: *The catch is that I want to do this using a variable* — You're not using the variable and are hardcoding the values into the source code. – Quentin Jan 24 '17 at 14:41
1

@Quentin, oh, i missed that. – Nina Scholz Jan 24 '17 at 14:46

Property access of object within an array using a variable in Javascript

3 Answers3