首页 > web前端 > js教程 > 如何使用字符串路径动态设置 JavaScript 对象中的嵌套属性值?

如何使用字符串路径动态设置 JavaScript 对象中的嵌套属性值?

DDD
发布: 2024-12-09 16:55:11
原创
872 人浏览过

How Can I Dynamically Set Nested Property Values in JavaScript Objects Using a String Path?

JavaScript 对象中的动态属性设置

假设我们给定一个对象 obj 和一个存储为字符串 propName 的属性名称,其中 propName 可以表示嵌套属性,例如为“foo.bar.foobar。”

问题:我们怎样才能使用propName作为路径动态设置obj.foo.bar.foobar的值?

解决方案:我们可以使用下面的分配函数来动态设置属性值:

function assign(obj, prop, value) {
    // Convert the string property name into an array of nested levels
    if (typeof prop === "string")
        prop = prop.split(".");

    // Check if the current level is the last (length == 1) or nested
    if (prop.length > 1) {
        // Shift the first level of nesting (e.g., "foo")
        var e = prop.shift();
        // Recursively call `assign` on the child object (e.g., obj.foo)
        assign(obj[e] =
                 Object.prototype.toString.call(obj[e]) === "[object Object]"
                 ? obj[e]
                 : {},
               prop,
               value);
    } else
        // For the last level, set the value directly
        obj[prop[0]] = value;
}
登录后复制

用法:

// Object to modify
var obj = {};
// String representing the nested property path
var propName = "foo.bar.foobar";
// Value to set
var newValue = "hello world";

// Call the `assign` function to dynamically set the property value
assign(obj, propName, newValue);

// Check the updated value (for debugging purposes)
console.log(obj.foo.bar.foobar); // Output: "hello world"
登录后复制

以上是如何使用字符串路径动态设置 JavaScript 对象中的嵌套属性值?的详细内容。更多信息请关注PHP中文网其他相关文章!

来源:php.cn
本站声明
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系admin@php.cn
热门教程
更多>
最新下载
更多>
网站特效
网站源码
网站素材
前端模板