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

Posted

技术标签:

【中文标题】如何从 Javascript 对象中获取属性值【英文标题】:How to get Property value from a Javascript object 【发布时间】:2016-09-27 09:31:12 【问题描述】:

我有一个 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"; 它显示undefined

注意:属性变量是用户从html中设置的,可以根据用户要求(他想要哪个属性值)进行更改。

我想要达到的目标:

1) 如果dataToRetrieve = "Name",应该给我"John"

2) 如果dataToRetrieve = "Id",应该给我"100"

3) 如果dataToRetrieve = "Address.Name",应该给我"Bangalore"

4) 如果 dataToRetrieve = "Address.Id" ,它应该给我 1

请戳这里:PLUNKR

【问题讨论】:

您可能还对 lodash 的 get 方法感兴趣。 lodash.com/docs#get 【参考方案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")
)


对于较旧的浏览器,请检查 polyfill option of reduce method。

【讨论】:

添加对undefined 值的保护是个好主意,就像上面的答案一样。 效果很好。 1个问题:如果obj包含一些数组属性,它会工作吗? like var obj = Id: "100", Name: "John", Address: [Id:1,Address:"Bangalore",Id:2,Address:"Mysore"] 然后调用函数像 GetPropertyValue(obj, "Address[0].Name") ? @BimalDas : GetPropertyValue(obj, "Address.0.Name") 会工作 这是一个允许括号表示法和带有空格的属性名称以及验证输入的版本:it.knightnet.org.uk/kb/node-js/get-properties【参考方案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")
);

【讨论】:

【参考方案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;
  

【讨论】:

【参考方案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);

您可以看到getNestedValue() 和它的孪生setNestedValue() 在https://***.com/a/37331868/4543207 工作

【讨论】:

以上是关于如何从 Javascript 对象中获取属性值的主要内容,如果未能解决你的问题,请参考以下文章

通过属性值从对象数组中获取JavaScript对象[重复]

javascript 从对象数组中获取不同的属性值

通过选择多个属性值之一从数组中获取 JavaScript 对象 [关闭]

如何获取 JavaScript 对象的所有属性值(不知道键)?

从对象获取属性值并将其分配给javascript中的变量

如何通过Javascript中的属性值获取另一个对象内的对象值