JavaScript如何返回两个变量取值范围内的新数组 按时间戳过滤元素

需求说明 #

实现一个过滤方法，接收4个入参：

• 起始日期（dateFrom）
• 结束日期（dateTo）
• 待处理原始数组（sourceArray）
• 存储epoch纪元时间戳的字段键名（dateKey）
  返回新数组，仅包含日期字段值落在起止日期区间内的元素。

示例待处理数据结构：

// 数据中date字段为待过滤的时间戳字段
[
  {
    "id": 2097190,
    "date": 1652965848416,
    "client": 49372,
    "level": 2,
    "source": 3,
    "status": 0
  },
  {
    "id": 2097185,
    "date": 1652965848761,
    "client": 49372,
    "level": 2,
    "source": 3,
    "status": 0
  }
]

原有代码问题 #

初始编写的版本存在几个会直接导致逻辑失效的错误：

• 运算符误用：判断大小的条件连接用了按位与&，不是逻辑判断需要的逻辑与&&，会导致判断结果完全偏离预期
• 冗余逻辑：已经通过入参拿到了要判断的日期字段名，不需要调用Object.keys(item).some()遍历对象所有属性，属于无意义的性能消耗
• 边界处理不全：仅判断了dateFrom为空的场景，没有覆盖dateTo为空、入参类型不合法、目标日期字段不存在/值无效的情况
• 无意义赋值：filter方法本身会返回构造好的新数组，不需要在返回前重新给入参myArray赋值

修正后的可直接使用实现 #

const filterByDateRange = (dateFrom, dateTo, sourceArray, dateKey) => {
  // 源数据非数组直接返回空数组，避免运行报错
  if (!Array.isArray(sourceArray)) return [];
  // 起止日期都未传值，直接返回原数组浅拷贝，不修改原数组引用
  if (!dateFrom && !dateTo) return [...sourceArray];

  // 统一转成数值类型时间戳，兼容传入Date对象、数字字符串的场景
  // 单边界为空时设为无穷大/无穷小，支持单边界过滤
  const startTs = dateFrom ? Number(dateFrom) : -Infinity;
  const endTs = dateTo ? Number(dateTo) : Infinity;

  return sourceArray.filter(item => {
    const itemTimestamp = Number(item?.[dateKey]);
    // 无效时间戳的元素直接排除
    if (Number.isNaN(itemTimestamp)) return false;
    // 闭区间判断，包含起止时间点的元素；需要开区间把>=、<=改成>、<即可
    return itemTimestamp >= startTs && itemTimestamp <= endTs;
  });
};

调用示例 #

// 筛选date字段值在1652965848000 ~ 1652965848500区间内的元素
const filteredResult = filterByDateRange(
  1652965848000,
  1652965848500,
  testData,
  'date'
);
// 运行后返回结果仅包含id为2097190的条目

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