JavaScript实现日期按月加减与格式化的三种实用方法

方法一：独立函数计算，处理月末边界异常

这是最稳健且推荐的方式，通过构建独立的工具函数来处理逻辑，避免污染全局对象。核心难点在于当原日期为“30日”或“31日”，而目标月份只有“28/29/30日”时，直接设置月份会导致JS自动进位到下个月。

第1步：定义日期转换辅助函数

首先创建一个 dateToDate 函数，用于将字符串格式的日期（如 '2023-10-05'）转换为 JavaScript Date 对象，若输入已是对象则直接返回，提高兼容性。

function dateToDate(date) {
  var sDate = new Date();
  // 判断输入类型
  if (typeof date == 'object' && typeof new Date().getMonth === "function") {
    sDate = date;
  } else if (typeof date == "string") {
    var arr = date.split('-');
    if (arr.length == 3) {
      sDate = new Date(arr[0] + '-' + arr[1] + '-' + arr[2]);
    }
  }
  return sDate;
}

第2步：实现月份加减逻辑（含回退修正）

编写 addMonth 函数。步骤如下： 1. 获取当前的年、月、日。 2. 计算新的年和月，处理跨年逻辑（当新月份 > 12 时）。 3. **关键步骤**：尝试创建新日期的 Date 对象。如果创建失败（即日期超出当月最大天数），JS会自动溢出到下一月。此时需要通过循环不断减小 eDay，直到 eDate.getMonth() 与预期的 eMonth 一致，从而锁定在该月的最后一天。

function addMonth(date, num) {
  num = parseInt(num);
  var sDate = dateToDate(date);

  var sYear = sDate.getFullYear();
  var sMonth = sDate.getMonth() + 1; // JS中月份从0开始，这里加1转为人类计数
  var sDay = sDate.getDate();

  var eYear = sYear;
  var eMonth = sMonth + num;
  var eDay = sDay;

  // 处理跨年
  while (eMonth > 12) {
    eYear++;
    eMonth -= 12;
  }

  // 初步设定目标日期
  var eDate = new Date(eYear, eMonth - 1, eDay);

  // 修正月份溢出（解决2月没有30号等边界问题）
  while (eDate.getMonth() != eMonth - 1) {
    eDay--;
    eDate = new Date(eYear, eMonth - 1, eDay);
  }

  return eDate;
}

第3步：简单的交互演示

结合HTML输入框和按钮测试上述函数：

<input type="date" id="date" />
<input type="number" id="num" value="1" />
<button onclick="calcDate()">计算</button>
<div id="result"></div>

<script>
function calcDate() {
  var d = document.getElementById('date').value;
  var n = document.getElementById('num').value;
  var eDate = addMonth(d, n);
  // 输出结果
  document.getElementById('result').innerHTML = 
    eDate.getFullYear() + '-' + (eDate.getMonth() + 1) + '-' + eDate.getDate();
}
</script>

方法二：扩展Date原型链，增加原生能力

通过修改 Date.prototype 添加自定义方法，使所有 Date 实例拥有 addMonths 等方法。这种方式代码更简洁，适合项目中使用频率较高的场景。注意要包含一个基础的 Format 方法以便查看结果。

// 日期格式化方法
Date.prototype.Format = function(fmt) {
  var o = {
    "M+": this.getMonth() + 1,
    "d+": this.getDate(),
    "h+": this.getHours(),
    "m+": this.getMinutes(),
    "s+": this.getSeconds(),
    "q+": Math.floor((this.getMonth() + 3) / 3),
    "S": this.getMilliseconds()
  };
  if (/(y+)/.test(fmt)) fmt = fmt.replace(RegExp.$1, (this.getFullYear() + "").substr(4 - RegExp.$1.length));
  for (var k in o)
    if (new RegExp("(" + k + ")").test(fmt))
      fmt = fmt.replace(RegExp.$1, (RegExp.$1.length == 1) ? (o[k]) : (("00" + o[k]).substr(("" + o[k]).length)));
  return fmt;
};

// 月份加减（自动处理月末边界）
Date.prototype.addMonths = function(m) {
  var d = this.getDate();
  this.setMonth(this.getMonth() + m);
  // 如果修改月份后日期变小了（例如从3月31日变到了2月28日之后又自动跳走），说明发生了溢出
  // 这里利用 setDate(0) 将日期设为上个月的最后一天，从而精准定位本月最后可用日
  if (this.getDate() < d) {
    this.setDate(0); 
  }
};

// 其他常用扩展
Date.prototype.addYears = function(y) {
  var m = this.getMonth();
  this.setFullYear(this.getFullYear() + y);
  if (m < this.getMonth()) this.setDate(0);
};
Date.prototype.addWeeks = function(w) {
  this.addDays(w * 7);
};
Date.prototype.addDays = function(d) {
  this.setDate(this.getDate() + d);
};

使用示例：

var date = new Date();
date.addMonths(1);
console.log(date.Format("yyyy-MM-dd"));

方法三：通用 DateAdd 函数，支持多种时间单位

此方法源自经典的 VBScript 风格实现，通过 switch 语句支持年(y)、季度(q)、月(m)、周(w)、日(d)、小时(h)等单位的加减。由于涉及修改当前对象引用，调用时需留意是否需要深拷贝或重新赋值。

function DateAdd(interval, number, date) {
  // 克隆日期以避免副作用（可选，视需求而定）
  // var targetDate = new Date(date.getTime()); 
  
  switch(interval) {
    case "y": 
        date.setFullYear(date.getFullYear()+number); 
        break;
    case "q": 
        date.setMonth(date.getMonth()+number*3);
        // 季度跨越可能涉及月底问题，实际工程中建议针对M单独做边界检查
        break;
    case "m": 
        date.setMonth(date.getMonth()+number);
        break;
    case "w": 
        date.setDate(date.getDate()+number*7);
        break;
    case "d": 
        date.setDate(date.getDate()+number); 
        break;
    case "h": 
        date.setHours(date.getHours()+number);
        break;
    case "mi": // 分钟通常缩写为i或m，但此处原代码混淆了m(minute)和m(month)，注意区分
        date.setMinutes(date.getMinutes()+number);
        break;
    case "s": 
        date.setSeconds(date.getSeconds()+number);
        break;
    default: 
        date.setDate(date.getDate()+number); 
        break;
  }
  return date;
}

// 使用示例
var now = new Date();
var newDate = DateAdd("m", 2, now); // 加两个月
alert(newDate.toLocaleDateString());

总结与注意事项

以上提供了三种 JavaScript 实现日期按月加减及格式化的方案。 - **方法一**最为安全，逻辑清晰，适合对原有 Date 行为无侵入要求的业务模块。 - **方法二**通过原型扩展提升了代码可读性和复用性，特别适用于工具类库开发。 - **方法三**提供了高度通用的接口，但在处理大跨度（如年、季度）时的边界修正逻辑较复杂，需根据具体场景完善。

在实际应用中，推荐使用 setDate(0) 的技巧来优雅地获取某月的最后一天，从而完美解决月末加减带来的日期错位问题。