首頁 >web前端 >js教程 >如何僅使用字串屬性名稱為深度嵌套的 JavaScript 物件動態賦值?

如何僅使用字串屬性名稱為深度嵌套的 JavaScript 物件動態賦值?

Barbara Streisand
Barbara Streisand原創
2024-12-10 07:26:11384瀏覽

How Can I Dynamically Assign Values to Deeply Nested JavaScript Objects Using Only a String Property Name?

JavaScript 中的動態屬性賦值

在某些場景下,您可能會遇到需要為物件中深層巢狀的屬性賦值的情況結構。但是,您可能只有字串形式的屬性名稱。這可能會帶來挑戰,因為直接存取屬性需要遍歷整個物件層次結構。

為了解決這個問題,我們可以使用allocate()函數:

function assign(obj, prop, value) {
    if (typeof prop === "string")
        prop = prop.split(".");

    if (prop.length > 1) {
        var e = prop.shift();
        assign(obj[e] =
                 Object.prototype.toString.call(obj[e]) === "[object Object]"
                 ? obj[e]
                 : {},
               prop,
               value);
    } else
        obj[prop[0]] = value;
}

用法

讓我們考慮一個例子:

var obj = {};
var propName = "foo.bar.foobar";

assign(obj, propName, "Value");

解釋

  1. 先使用以下方法將prop轉換為陣列split(".") 方法,結果為 ["foo", "bar", "foobar"]。
  2. 陣列的第一個元素 foo 被分配給 obj。
  3. Object.prototype.toString.call(obj[e]) === "[object Object]" 條件檢查 obj.foo 是否為物件。如果 true,我們將 obj.foo 指派給 obj[e]。
  4. 如果 obj.foo 不是一個對象,我們建立一個新物件並將其指派給 obj.foo。
  5. 我們重複bar 和 foobar 的過程,最後將 obj.foo.bar.foobar 設定為傳遞給 allocate() 函數的值。

透過利用使用 allocate() 函數,您可以動態地將值指派給任何深度等級的屬性,即使您只有字串形式的屬性名稱。

以上是如何僅使用字串屬性名稱為深度嵌套的 JavaScript 物件動態賦值?的詳細內容。更多資訊請關注PHP中文網其他相關文章!

陳述:
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn