首页 >web前端 >js教程 >如何仅使用字符串属性名称为深度嵌套的 JavaScript 对象动态赋值?

如何仅使用字符串属性名称为深度嵌套的 JavaScript 对象动态赋值?

Barbara Streisand
Barbara Streisand原创
2024-12-10 07:26:11393浏览

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