Maison >interface Web >js tutoriel >Comment puis-je définir dynamiquement des valeurs de propriété imbriquées dans des objets JavaScript à l'aide d'un chemin de chaîne ?

Comment puis-je définir dynamiquement des valeurs de propriété imbriquées dans des objets JavaScript à l'aide d'un chemin de chaîne ?

DDD
DDDoriginal
2024-12-09 16:55:11838parcourir

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

Paramètre de propriété dynamique dans les objets JavaScript

Supposons que nous recevions un objet obj et un nom de propriété stocké sous forme de chaîne propName, où propName peut représenter des propriétés imbriquées, telles que comme "foo.bar.foobar."

Problème : Comment pouvons-nous définir dynamiquement la valeur de obj.foo.bar.foobar en utilisant propName comme chemin ?

Solution : Nous pouvons utiliser la fonction d'affectation ci-dessous pour définir la valeur de la propriété de manière dynamique :

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;
}

Utilisation :

// 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"

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!

Déclaration:
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn