如何从Javascript对象中获取属性值

Question

我有一个JavaScript对象。

var obj = { Id: "100", Name: "John", Address: {Id:1,Name:"Bangalore"} }
var dataToRetrieve= "Name";

function GetPropertyValue(object,dataToRetrieve){
      return obj[dataToRetrieve]
}
var retval = GetPropertyValue(obj,dataToRetrieve)

这段代码本来很好用。但是，如果我试图获取“Address.Name”的值，则会显示未定义，例如：var dataToRetrieve =“Address.Name”;。 注意：属性变量是由HTML中的用户设置的，并且可以根据用户的要求进行更改（他需要哪个属性值）。

我的目标是：

1）如果 dataToRetrieve =“Name”，则应该给我“John”，

2）如果 dataToRetrieve =“Id”，则应该给我“100”，

3）如果 dataToRetrieve =“Address.Name”，则应该给我“Bangalore”，

4）如果 dataToRetrieve =“Address.Id”，则应该给我1 这是Plunkr链接：PLUNKR。

- Bimal Das

---

您可能也对 Lodash 的 get 方法感兴趣。https://lodash.com/docs#get - Luke

Answer 1

使用 reduce() 方法

var obj = {
  Id: "100",
  Name: "John",
  Address: {
    Id: 1,
    Name: "Bangalore"
  }
}

function GetPropertyValue(obj1, dataToRetrieve) {
  return dataToRetrieve
    .split('.') // split string based on `.`
    .reduce(function(o, k) {
      return o && o[k]; // get inner property if `o` is defined else get `o` and return
    }, obj1) // set initial value as object
}


console.log(
  GetPropertyValue(obj, "Name"),
  GetPropertyValue(obj, "Id"),
  GetPropertyValue(obj, "Address.Name"),
  GetPropertyValue(obj, "Address.Id"),
  GetPropertyValue(obj, "Address.Idsd"),
  GetPropertyValue(obj, "Addre.Idsd")
)

---

对于旧版浏览器，请查看reduce方法的polyfill选项。 polyfill选项。

- Pranav C Balan

---

最好像上面的答案一样，添加对“undefined”值的保护。 - Renato Gama

它运行良好。一个问题：如果 obj 包含一些数组属性，它能工作吗？像这样：var obj = { Id: "100", Name: "John", Address: [{Id:1,Address:"Bangalore"},{Id:2,Address:"Mysore"}] } 然后像 GetPropertyValue(obj, "Address[0].Name") 这样调用函数？ - Bimal Das

@BimalDas：GetPropertyValue(obj, "Address.0.Name") 可以工作。 - Pranav C Balan

这里有一个版本，允许使用括号表示法和带空格的属性名称，并验证输入：https://it.knightnet.org.uk/kb/node-js/get-properties/ - Julian Knight

Answer 2

请使用以下函数：

var obj = { Id: "100", Name: "John", 
            Address:  [{ Id:1, Name:"Bangalore" }, { Id:2, Name: "Mysore" } ] };

function GetPropertyValue(object, dataToRetrieve) {
    dataToRetrieve.split('.').forEach(function(token) {
      if (object) object = object[token];
    });
    
    return object;
}

console.log(
  GetPropertyValue(obj, "Address.0.Name"),
  GetPropertyValue(obj, "Address.1.Id"),
  GetPropertyValue(obj, "Name"),
  GetPropertyValue(obj, "Id"),
  GetPropertyValue(obj, "Unknown"),
  GetPropertyValue(obj, "Some.Unknown.Property")
);

- gevorg

Answer 3

 function GetPropertyValue(object,dataToRetrieve){
  var valueArray = dataToRetrieve.split(".");
  if (valueArray.length <= 1) {
    return object[valueArray];
  } else {
    var res;
    function browseObj(obj, valueArray, i) {
      if (i == valueArray.length)
        res = obj;
      else
        browseObj(obj[valueArray[i]], valueArray, i+1);
    }
    browseObj(object, valueArray, 0);
    return res;
  }
}

- boehm_s

Answer 4

我写了一个标准的可重用对象方法来动态访问嵌套属性。就像这样：

Object.prototype.getNestedValue = function(...a) {
  return a.length > 1 ? (this[a[0]] !== void 0 && this[a[0]].getNestedValue(...a.slice(1))) : this[a[0]];
};

它将为嵌套属性使用动态参数。如果它们是字符串类型，则它们是对象属性，如果是数字类型，则它们是数组索引。一旦你学会了这个，你的工作就变得非常容易了。让我们看看。。。

Object.prototype.getNestedValue = function(...a) {
  return a.length > 1 ? (this[a[0]] !== void 0 && this[a[0]].getNestedValue(...a.slice(1))) : this[a[0]];
};
var props = ["Address","Name"],
      obj = { Id: "100", Name: "John", Address: {Id:1,Name:"Bangalore"} },
      val = obj.getNestedValue(...props);
console.log(val);
// or you can of course do statically like
      val = obj.getNestedValue("Address","Name");
console.log(val);

您可以在https://dev59.com/eJffa4cB1Zd3GeqP4zpu#37331868中看到getNestedValue()和它的姊妹函数setNestedValue()的使用。

- Redu