为什么给Date.setDate()传入字符串参数时会得到异常结果？

根本原因 #

该问题是JavaScript隐式类型转换和Date.setDate()的参数自动推算逻辑共同作用导致的，具体执行流程如下：

• today.getDate()返回数值类型的当月日期，示例中值为12
• 数值12和字符串'30'执行+运算时，JS会优先触发字符串拼接逻辑，最终得到字符串'1230'，而非预期的数值求和结果42
• Date.setDate()接收参数时会自动将字符串转为数值，也就是1230，会尝试将当前日期对象的当月日期设置为第1230天
• setDate()原生支持传入超出当月天数的参数，会自动向后推算对应的远期日期：1230天换算后约为3年零4个月，最终就得到了2025年的异常结果。

修复方案 #

在做日期运算前，先将字符串类型的时长参数转为数值类型即可，可选写法如下：

today = new Date(); //2021-10-12
duration2 = '30'
// 方式1：用Number构造函数显式转换
new Date(new Date().setDate(today.getDate() + Number(duration2))); 
// 方式2：用+运算符隐式转数值
new Date(new Date().setDate(today.getDate() + +duration2)); 
// 方式3：用parseInt转换（仅适用于整数时长场景）
new Date(new Date().setDate(today.getDate() + parseInt(duration2, 10))); 

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