使用filter方法对比截取后的日期字符串无效问题求助

你的过滤代码逻辑本身是正确的，在你提供的示例数组里运行应该能返回New TV那条数据。没生效大概率是以下几种情况：

可能的原因 #

• 日期字符串存在隐形字符：比如date字段前后有空格、换行符或全角空格，导致slice(0,4)拿到的内容和字面量"2021"不匹配。你单独测试的是第一个2022年的元素，但第二个2021年元素的date可能存在这类隐形字符。
• 实际数组数据不符：你提供的示例数组里有2021年的数据，但实际运行时的ExpensesData中，目标数据的date格式可能不是"YYYY-MM-DD"，或者年份填写错误。
• 变量名或作用域问题：比如ExpensesData变量在过滤时的作用域里不是你定义的目标数组，或者变量名拼写错误。

验证与解决方法 #

1. 先排查每个元素的实际截取结果 #

添加日志打印，直观确认每个元素的年份截取值和匹配结果：

ExpensesData.forEach(e => {
  const year = e.date.slice(0,4);
  console.log(`标题：${e.title}，截取年份：${year}，是否匹配2021：${year === "2021"}`);
});

2. 处理隐形字符 #

如果是日期前后有空格，先做trim处理再截取年份：

const filteredData = ExpensesData.filter(e => e.date.trim().slice(0,4) === "2021");

3. 用更健壮的匹配方式 #

• 正则匹配（确保年份开头且后跟横杠，避免误匹配类似20210-xx-xx的异常格式）：

const filteredData = ExpensesData.filter(e => /^2021-/.test(e.date.trim()));

• 转换为Date对象获取年份（彻底避免字符串格式问题）：

const filteredData = ExpensesData.filter(e => new Date(e.date).getFullYear() === 2021);

注：如果date格式不合法，new Date()会返回无效日期，此时可额外加合法性判断：

const filteredData = ExpensesData.filter(e => {
  const date = new Date(e.date);
  return !isNaN(date.getTime()) && date.getFullYear() === 2021;
});

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