使用字符串訪問嵌套屬性

Question

var person = { 
    name: 'Joe', 
    contact: { 
    phone: '555' 
    } 
} 

var nameOfPerson = person['name']; //Joe 

var str = 'contact.phone'; 
var phoneToPerson = person[str]; //undefined 

這是可能以某種方式做的嗎？我得到了一些邏輯，我最終得到了一個字符串，我需要訪問它的嵌套屬性。

https://jsbin.com/xehokozaco/edit?js,console

Answer 1

您必須按照句點拆分字符串，然後迭代訪問每個節點。這可以在一個簡單的reduce來完成：

var value = str.split('.').reduce(function(p,prop) { return p[prop] }, person); 

以上將不考慮工作，如果str包含句與否，即對於name以及contact.phone。

Answer 2

自然，沒有。但是有辦法做到這一點，比如將字符串拆分爲.，並從person對象遞歸下降。也可以通過評估eval或new Function中的完整字符串，但出於安全原因，我極度不鼓勵。

Answer 3

你可以通過分割字符串。 [..]運算符允許您按名稱（和數組項目索引）訪問對象屬性。在嵌套對象的情況下，您只需一個接一個地訪問它們。

嘗試這樣的：

var person = { 
 
    name: 'Joe', 
 
    contact: { 
 
    phone: '555' 
 
    } 
 
} 
 

 
var nameOfPerson = person['name']; //Joe 
 

 
var str = 'contact.phone'; 
 

 
var phoneToPerson = str.split('.').reduce(function(o, key) { 
 
    return o[key]; 
 
}, person); 
 

 
alert(phoneToPerson);

Answer 4

嘗試

var select = "contact.phone"; 
var value = person; 
select.split(".").forEach(function(val){ 
    value = value[val]; 
}); 
console.log(value); 

Answer 5

我知道這個職位是很老，但它的奇怪，我不能看的很流行的 「Lodash」 解決方案這裏允許安全地獲取對象嵌套屬性。

例子：

var object = { 
    a: [ 
     { 
     b: { 
      c: 3 
     } 
     } 
    ] 
}; 

_.get(object, 'a[0].b.c'); // → 3 

對於示例：

var person = { 
    name: 'Joe', 
    contact: { 
    phone: '555' 
    } 
} 

var personPhoneProp = 'contact.phone'; 

_.get(person, personPhoneProp); // -> '555' 

文檔：https://lodash.com/docs#get