JavaScript过滤数组空对象问题：第二段代码无法赋值变量

第一段代码用filter能正常把非空对象赋值给filteredEmpty1，但第二段代码里，虽然console.log(e)能打出想要的数据，filteredEmpty2却一直是undefined，根本拿不到过滤后的结果。

你的代码如下：

var filteredEmpty1 = json_data.children.filter(function(value, index, arr) {
    if (value.children.length != 0) {
        return value//Returns what I need
    } else {
        console.log("EMPTY")
    };
});


json_data = filteredEmpty1;
json_data = {
    "name": "RVs",
    "children": json_data
};

var filteredEmpty2 = json_data.children.forEach(function(value) {
    value.children.filter(function(e) {
        if (e.children.length != 0) {
            console.log(e)//Logs what I need to return
            return(e)//Returns undefined
        } else {
            console.log("EMPTY")
        };
    });
})

错误原因 #

1. forEach本身不返回值：forEach只是用来遍历数组的工具，它的返回值永远是undefined，所以你把forEach的执行结果赋值给filteredEmpty2，自然只能得到undefined。
2. 内部filter的结果没被收集：value.children.filter(...)确实会生成过滤后的新数组，但这个结果没有被保存或返回，只是在回调函数里执行了一遍，外部根本拿不到。
3. （额外提醒）filter的回调应该返回布尔值：你第一段代码能工作是因为返回非空对象会被自动转成true，但规范写法是直接返回判断条件，比如return value.children.length !== 0，代码可读性会更高。

修正代码 #

如果想收集每个value.children过滤后的结果，用map代替forEach——map会返回一个新数组，把每个回调的返回值都收集起来：

var filteredEmpty2 = json_data.children.map(function(value) {
    return value.children.filter(function(e) {
        return e.children.length !== 0;
    });
});

要是你需要把所有过滤后的元素合并成一个一维数组，在map后面加个flat()就行：

var filteredEmpty2 = json_data.children.map(function(value) {
    return value.children.filter(function(e) {
        return e.children.length !== 0;
    });
}).flat();

内容的提问来源于stack exchange，提问作者Joseph Dain