Создание многоуровневого меню из объекта
 

Здравствуйте, уважаемые форумчане. Требуется помощь в создание многоуровневого меню. Имеется следующие данные в js.

"tags": {
        "language": {
            "parent": {
                "button": {
                    "parent": {
                        "home": {
                            "parent": null
                        }
                    }
                }
            }
        },
        "meta": { "parent": ["user", "required_fields", "button"] },
        "button": { "parent": ["meta", "statistics", "home"] },
        "user":{"parent": "home"},
        "required_fields":{"parent":null},
        "transactions":{"parent":null},
        "statistics":{"parent":null},
        "home":{"parent":null}
    }

Требуется по этим данным, создать меню, учитывающее вложенность до 3-го уровня. Как вижу решение данной задачи.
Пункт1. Сначала "развернуть" данные пункты меню и создать цепочку из child, взамен parent'ов примерно такого вида:

"tags": {
        "home": {
            "child": {
                "button": {
                    "child": {
                        "language": {
                            "child": null
                        }
                    }
                }     
            }
        },
        "user": { "child":  "meta"}
    }

Пункт 2. По этой цепочке с помощью рекурсивной функции построить список и вставить в DOM-структуру в необходимом месте.
Что на данный момент уже реализовал.
Пункт 1:

//объявляю переменную с входными данными
var tags = json.tags;
//создаю пустой объект, где будет храниться структурированные данные
var tag_str = {};
function ref(tags, x, y)  {
    for (key in tags) {
        console.log('key=', tags[key].parent);
        //если parent null, то создаю ключ в новой структуре со значением null
        if (tags[key].parent == null)  {
            tag_str[key] = null;
        // рассматриваю случай, когда parent является массивом
        } else if (tags[key].parent instanceof Array)  {
            //пробегаю по всем элементам массива
            //и создаю объекты в новой структуре, где переназначаю свойства с parent на  child
            for (var i = 0; i < tags[key].parent.length; i++) {
                if (typeof tag_str[tags[key].parent[i]] == "object" && !(tag_str[tags[key].parent[i]] instanceof Array))  {
                    if (tag_str[tags[key].parent[i]] && typeof tag_str[tags[key].parent[i]].child == "object" && !( tag_str[tags[key].parent[i]].child instanceof Array ) )  {
                        tag_str[tags[key].parent[i]].child[key] = null;
                }  else  {
                        tag_str[tags[key].parent[i]] = {};
                        tag_str[tags[key].parent[i]].child = {};
                        tag_str[tags[key].parent[i]].child[key] = null;
                    }
                }  else  {
                    tag_str[tags[key].parent[i]] = {};
                   if (typeof tag_str[tags[key].parent[i]].child == "object" && !(tag_str[tags[key].parent[i]].child instanceof Array))  {
                       tag_str[tags[key].parent[i]].child[key] = null;
                   } else {
                       tag_str[tags[key].parent[i]].child = {};
                       tag_str[tags[key].parent[i]].child[key] = null;
                   }
                }
            }
        //рассматриваю случай, когда parent объект
        } else if (typeof tags[key].parent == "object" && !(tags[key].parent instanceof Array))  {
            if (tags[key].parent !== null) {
        // x вводится для учёта вложенности новой структуры
                if(x)  {
                        tag_str[key] = {};
                        tag_str[key].child = {};
                        tag_str[key].child[x] = null;
                        ref(tags[key].parent, x);
                }
                else  {
                    tag_str[tags[key].parent] = {};
                    tag_str[tags[key].parent].child = {};
                    tag_str[tags[key].parent].child = null;
                    console.log('приехали');
                    var x = key;
                    ref(tags[key].parent, x);
                }
            }
            else  {
                console.log('parent null');
            }
        }
    } 
}

Пункт 2.

ref(tags);
var tags = json.tags;
function rec(tag_str, c) {
    var str = '';
    for (key in tag_str) {
        if (tag_str[key].child == null)  {
            str += rec(tag_str[key].child);
            str += '<ul><li>' + key ;
            delete tag_str[key];
        }  
        else {
            if (typeof tag_str[key].child == 'object' && !tag_str[key].child instanceof Array)  {
                str += rec(tag_str[key].child);
                str += '<li>' + key;
                // delete tag_str[key];
            }
            if (tag_str[key].parent instanceof Array)  {
                for (var i = 0; i < tag_str[key].child.length; i++) {
                    str += '<li>' + tag_str[key].child[i];
                    // delete tag_str[key][i];
                }
                str += rec(tag_str[key].child);
                // delete tags[key];
            }
        }
    }
    str += '</li>'
    str += '</ul>';
    return str;
}

В итоге строится структура. Для массивов всё создается вроде как нормально, но для объектов не учитывается вложенность. Возможно всё делается проще и не нужно такое нагромождение условий. Буду благодарен за помощь в решение данной задачи.

Эти данные нужно в любом случае обработать. Есть вероятность, что будут появляться такие проблематичные свойства. Согласен, не логично

Окей, а если без таких вот проблематичных свойств обрабатывать объект? Как это можно сделать, чтобы было верно?)

pzyryanov,

<script>
var menu = {
	"item1.1": {
		"item2.1": {
			"item3.1": "#link3.1",
			"item3.2": "#link3.2"
		},
		"item2.2": "#link2.2"
	},
	"item1.2": {
		"item2.3": {
			"item3.3": "#link3.3",
			"item3.4": "#link3.4"
		}
	},
	"item1.3": "#link1.3"
};
function build(list) {
	var html = '', item, deep;
	for (item in list) {
		deep = typeof list[item] == 'object';
		html += '<li><a href="' +(deep ? '#' : list[item])+ '">' +item+ '</a>' +(deep ? build(list[item]) : '')+ '</li>';
	}
	return '<ul>' + html + '</ul>';
}
document.write(build(menu));
</script>

Спасибо, всё заработало) структура, действительно была неверная. Но за помощь плюсанул)