新手求教：JavaScript filter()方法代码拆解及结果显示问题

一、代码拆解 #

你给出的代码和命名函数版filter的逻辑完全一致，只是把函数定义直接内嵌到了filter参数里，具体拆解如下：

const nums = [0,10,20,30,40,50];
nums.filter( function(num) {
    return num > 20;
})

1. const nums = [0,10,20,30,40,50];：定义一个数字数组，作为filter方法的调用主体。
2. nums.filter(...)：调用数组的filter方法，该方法会遍历数组每一个元素，根据传入的判断函数筛选符合条件的元素，最终返回一个新数组。
3. function(num) { return num > 20; }：这就是匿名函数——没有单独定义函数名，直接作为参数传给filter：
   • num是函数参数，对应filter遍历到的当前数组元素（和你熟悉的命名函数参数作用完全相同，比如canVote里的age）。
   • return num > 20;是判断逻辑：当前元素大于20时，会被保留到filter返回的新数组中；反之则被排除。

对比你熟悉的命名函数写法，本质只是把函数定义从外部移到了filter参数里：

// 命名函数版写法
function isGreaterThan20(num) {
    return num > 20;
}
nums.filter(isGreaterThan20);

二、显示过滤后的返回值 #

filter方法返回筛选后的新数组，但不会修改原数组nums，可以通过以下两种方式查看返回值：

方式1：存入变量后打印 #

const nums = [0,10,20,30,40,50];
// 把filter返回值存到新变量
const filteredResult = nums.filter(function(num) {
    return num > 20;
});
// 控制台打印结果
console.log(filteredResult); // 输出：[30, 40, 50]

方式2：直接打印返回值 #

const nums = [0,10,20,30,40,50];
// 直接将filter返回值传给console.log
console.log(nums.filter(function(num) {
    return num > 20;
})); // 输出：[30, 40, 50]

三、返回类型说明 #

• filter方法的返回值是新的数组（Array类型），元素类型和原数组一致（这里原数组是数字，返回数组的元素也为数字）。
• 如果原数组中没有符合筛选条件的元素，filter会返回空数组[]，不会返回null或undefined。

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