JavaScript获取数组中元素的父级

Question

我正在尝试获取数组中特定（引用的）对象的父级。 例如：

var data = [
    {
        key: "value1"
        children: [
            {
                key: "value2"
            },
            {
                key: "value3"
                children: [
                    {
                        key: "value3a"
                    },
                    {
                        key: "value3b"
                    }
                ]
            }
        ]
    },
    {
        key: "value4"
    }
];

当发生某些事情时，我会得到以下内容：

var clicked = {
    key: "value3a"
}

在这种情况下，我知道value3a已被单击，它与变量data进行了数据绑定。

问题是，如何轻松地获取clicked的父级？它应该返回我想要的value3的整个子数组：

[
    {
        key: "value3a"
    },
    {
        key: "value3b"
    }
]

注意：目前我正在使用UnderscoreJS在数组中查找对象。所以可能UnderscoreJS可以帮忙吗？

- thomas479

---

看一下这个演示点击树的例子：https://dev59.com/VWIj5IYBdhLWcg3w_5zl#19692791 - Maxim Shoustin

可能是重复的问题：Javascript对象：获取父级 - JJJ

请查看以下链接：https://dev59.com/LFTTa4cB1Zd3GeqPvcju#5154070 - VikrantMore

Answer 1

你可以使用递归的 reduce 函数。

// Given
var data = [
    {
        key: "value1",
        children: [
            {
                key: "value2"
            },
            {
                key: "value3",
                children: [
                    {
                        key: "value3a"
                    },
                    {
                        key: "value3b"
                    }
                ]
            }
        ]
    },
    {
        key: "value4"
    }
];
var clicked = {
    key: "value3a"
};

我们可以定义一个递归的reduce函数，并将其父级作为上下文。

var rec_reduce = function(memo, obj) {
    if(obj.key == clicked.key) {
        return this || memo;
    }
    return _.reduce(obj.children, rec_reduce, memo, obj.children) || memo;
};

// Now we can lookup the key in clicked with one line
_.reduce(data, rec_reduce, null, data);

// Returns [{key: "value3a"}, {key: "value3b"}]

或者，如果你想利用underscore来创建一个像第一个答案建议的映射表，那就更简单了：

var map = {};
var rec_map = function(obj, i, parent) {
    map[obj.key] = parent;
    _.each(obj.children, rec_map);
};
_.each(data, rec_map);

// Now getting the parent list is just a look up in the map
map[clicked.key]

// Returns [{key: "value3a"}, {key: "value3b"}]

- Brad Pitcher

Answer 2

只需创建一个子父映射表，以便您可以查找所需内容：

var map = {};
function recurse(arr, parent) {
    if (!arr) return;
    for (var i=0; i<arr.length; i++) { // use underscore here if you find it simpler
        map[arr[i].key] = parent;
        recurse(arr[i].children, arr[i]);
    }
}
recurse(data, {key:"root", children:data});

现在，在您的事件处理程序中，您可以轻松地使用该映射来查找您的兄弟姐妹：

map[clicked.key].children

- Bergi