1

JavaScriptを使用して以下のようなネストされたツリーオブジェクトを動的に形成しようとしていますが、これを実現するための最良の方法を教えてもらえますか?

 var contextpath= {
        text: "TreeRoot",
        items: [ {
            text: "subgroup1" ,
            items: [ {
                text: "subgroup2",
                items: [ {
                    text: "subgroup3",
                    items: [ {
                        text: "subgroup4",
                        items: [ {
                            text: "subgroup5"
                        }]
                    }]
                }]
            }]
        }]
    };

オブジェクトに変換しようとしている文字列を区切りました(ツリーコンポーネントのデータソースとして使用できます)。

var path = "TreeRoot | subgroup1 | subgroup2";

以下のようなものを実装しようとしていますが、より少ない数の変数を使用して再帰/ループを使用しています。

    var contextpathText= {};
    contextpathText.text ="TreeRoot";

    var childObject={};
    var items=[];
    childObject.text ="subgroup1";
    items.push(childObject);
    contextpathText.items=(items);
4

2 に答える 2

2

深度カウンターが必要であり、作業しているオブジェクトの現在のレベルを保存する必要があります。

var obj = {text:''}, parent, child, i = 0;
obj.text = 'TreeRoot';
parent = obj;
while (++i <= 5) {
    if (parent.items === undefined) parent.items = []; // because you don't have an items on the last subgroup you can't put it in the object literal
    child = {text: 'subgroup'+i};
    parent.items.push(child);
    parent = child;
}
parent = child = null; // cleanup
obj;

jsbeautified JSON.stringify(obj)は現在

{
    "text": "TreeRoot",
    "items": [{
        "text": "subgroup1",
        "items": [{
            "text": "subgroup2",
            "items": [{
                "text": "subgroup3",
                "items": [{
                    "text": "subgroup4",
                    "items": [{
                        "text": "subgroup5"
                    }]
                }]
            }]
        }]
    }]
}

区切られた文字列の編集

var path = 'TreeRoot|subgroup1|subgroup2';

var obj = {text:''}, parent, child, levelText = path.split('|').reverse();
obj.text = levelText.pop() || '';
parent = obj;
while (levelText.length > 0) {
    child = {text: levelText.pop()};
    if (!parent.items) parent.items = [];
    parent.items.push(child);
    parent = child;
}
obj;
于 2012-12-11T23:14:02.720 に答える
1

私をそれに打ち負かしました、しかし私はこのコードで行きました:

var contextpath = { text: "TreeRoot", items: []}

var items = contextpath.items;

for(var i = 1; i <= 5; i++) {
    items.push({ text: "subgroup" + i, items: []});
    items = items[0].items;
}

この種のことについては、親子の命名法は間違いなく明確ですが、最初に新しいオブジェクトを変数として宣言する必要はなく、オブジェクトリテラルをプッシュするだけでよいことを示したいと思います。

おっと、ちょうど今、あなたがあなたの望む構造にitems配列を持っていないことに気づきました。私のコードはスペアを作成するので、最終的には

// snip
                text: "subgroup4",
                    items: [ {
                        text: "subgroup5",
                        items: []
                    }]
// etc.
于 2012-12-11T23:18:29.110 に答える