JavaScript如何补全数组空对象使其长度等于当月总天数

首先注意你给出的原始data存在语法错误：外层应该用数组而非对象包裹，对象属性之间应该用逗号分隔而非分号，字符串值需要加引号，修正后的原始结构参考：

// 语法修正后的原始数据
let data = [
  {date: 3, type: 'solid', total: 3},
  {date: 5, type: 'solid', total: 10}
]

实现逻辑 #

整体分三步完成转换：

• 获取当前月份的总天数，作为最终结果的长度依据，自动适配大小月、闰年2月的天数差异
• 将原始数据转换为以日期为键的映射表，实现O(1)时间复杂度的快速匹配，避免嵌套循环的性能损耗
• 从日期1到当月最后一天遍历，逐天生成数据对象：匹配到原始数据就取对应total值，未匹配到则将total设为null，type字段统一保留为solid

你示例中用数字做key的对象结构，和JS数组的索引访问逻辑完全等价，直接返回数组即可满足result[0]、result[2]这类索引取值的需求，不需要额外转成普通对象。

完整可运行代码 #

/**
 * 生成补全后的整月日期数据
 * @param {number} [year] - 目标年份，默认取当前系统年份
 * @param {number} [month] - 目标月份（取值0-11，0对应1月），默认取当前系统月份
 * @param {Array} sourceData - 已有的日期明细数据
 * @returns {Array} 长度等于当月天数的补全后数据
 */
function buildFullMonthData(year = new Date().getFullYear(), month = new Date().getMonth(), sourceData = []) {
  // 计算当月总天数：传入月份+1、日期为0时，Date会自动返回当月最后一天的日期数值
  const totalDays = new Date(year, month + 1, 0).getDate()
  // 构建日期-总计值的映射表
  const dateValueMap = sourceData.reduce((map, item) => {
    map[item.date] = item.total
    return map
  }, {})
  // 逐天生成数据
  return Array.from({ length: totalDays }, (_, idx) => {
    const currentDay = idx + 1
    return {
      date: currentDay,
      type: 'solid',
      total: dateValueMap[currentDay] ?? null
    }
  })
}

// 调用示例
const originData = [
  {date: 3, type: 'solid', total: 3},
  {date: 5, type: 'solid', total: 10}
]
// 以2024年8月（共31天）为例生成数据
const fullData = buildFullMonthData(2024, 7, originData)
console.log(fullData)

逻辑说明 #

• 月份天数计算用JS原生Date能力实现，不需要引入第三方日期处理库，自动处理所有月份的天数规则
• 映射表匹配的方式比双层循环查找性能更高，原始数据量越大优势越明显
• 用??空值合并运算符做赋值判断，仅当对应日期无匹配数据时才将total设为null，不会把原始数据中total为0、false这类合法假值错误覆盖

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