將屬性鏈添加到JS Object

Question

是否可以在一行中添加屬性到添加屬性的添加屬性...

var some_object = {};
some_object.prop_a = "hi";
some_object.prop_b.prop_c.prop_d = "ho";

雖然第2行顯然有效，第3行不會因為它返回cannot read property of undefined錯誤的cannot read property of undefined 。 我知道，當prop_d應該被分配時，prop_b和prop_c不存在。 但是有一個簡單的單行程來做我想做的事情（即添加嵌套屬性，即使嵌套對象中的某些級別還不存在）？

Answer 1

你當然可以寫一個函數來做到這一點。 也許這樣的東西：

 function addPropertyChain(chain, val, obj) { var propChain = chain.split("."); if (propChain.length === 1) { obj[propChain[0]] = val; return; } var first = propChain.shift(); if (!obj[first]) { obj[first] = {}; } addPropertyChain(propChain.join("."), val, obj[first] ); } var some_object = {}; addPropertyChain("prop_b.prop_c.prop_d","ho",some_object); console.log(some_object); 

Answer 2

我知道，當prop_d應該被分配時，prop_b和prop_c不存在。

如果是這種情況，您可以這樣做：

some_object.prop_b = {
  prop_c : {
    prop_d : "ho"
  }
};

（或者，在一行:)

some_object.prop_b = { prop_c : { prop_d : "ho" } };

您只是使用JavaScript的對象初始化程序語法來創建嵌套對象。

但是，請注意，如果這些值已經存在，則會覆蓋任何現有的prop_b或prop_b.prop_c值。

Answer 3

您可以在分配之前調用方法以確保插槽是對象。 缺點是您已將路徑作為字符串提供。 你必須走鏈子。

function ensurePropertyOnObject(o, m)
{
    var props = m.split('.');
    var item;
    var current = o;

    while(item = props.shift()) {
        if(typeof o[item] != 'object') {
            current[item] = {};
        }
        current = o[item];
    }    
}

ensurePropertyOnObject(some_object, "prop_b.prop_c.prop_d");
some_object.prop_b.prop_c.prop_d = "ho";
console.log(some_object);

查看示例： https ： //jsfiddle.net/ho4k02fr/

Answer 4

為了動態訪問和設置對象屬性，我發明了兩個名為Object.prototype.setNestedValue()和Object.prototype.getNestedValue() Object方法，其中您將嵌套屬性作為參數提供。 對於Object.prototype.setNestedValue() ，最后一個參數是要在末尾設置的值。 像這樣;

 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.setNestedValue = function(...a) { return a.length > 2 ? typeof this[a[0]] === "object" && this[a[0]] !== null ? this[a[0]].setNestedValue(...a.slice(1)) : (this[a[0]] = typeof a[1] === "string" ? {} : new Array(a[1]), this[a[0]].setNestedValue(...a.slice(1))) : this[a[0]] = a[1]; }; var some_object = {}; some_object.prop_a = "hi"; some_object.setNestedValue("prop_b","prop_c","prop_d","ho"); console.log(JSON.stringify(some_object,null,2)); 

您還可以添加數組對象。 為此，您必須輸入數字類型的索引。 讓我們舉個例子......

 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.setNestedValue = function(...a) { return a.length > 2 ? typeof this[a[0]] === "object" && this[a[0]] !== null ? this[a[0]].setNestedValue(...a.slice(1)) : (this[a[0]] = typeof a[1] === "string" ? {} : new Array(a[1]), this[a[0]].setNestedValue(...a.slice(1))) : this[a[0]] = a[1]; }; var some_object = {}; some_object.prop_a = "hi"; some_object.setNestedValue("prop_b",3,"prop_d","yay"); some_object.setNestedValue("prop_b",0,"prop_d","zero this is"); some_object.setNestedValue("prop_b",1,"prop_d","i am the one"); some_object.setNestedValue("prop_b","prop_c","prop_d","ho"); console.log(JSON.stringify(some_object,null,2)); 

您會注意到prop_c未登記但仍然作為分配給prob_b的數組的屬性存在，並且它是完全可訪問的。