JS实用小方法-获取向前或向后几天的日期与星期(附严格模式下未知参数解决方案)

一、代码注释详解

参数相关

  • directionFlag参数控制生成时间的方向,'before'当前时间向前,'after'当前时间向后, 默认为向后生成
  • fewDays 参数控制向前或向后显示的天数 默认一周 例:3,'15'
  • dateType 参数控制返回的时间格式, 默认'-',即以'-'为分割符 例: '.','/','-'
  • weekType 参数控制返回的周前缀文字相关, 默认'星期' 例: '周','星期'
  • zeroFillFlag 参数控制返回的时间是否数字补零,默认true(小于9补零前面补零)
  • reverseFlag 参数控制返回的数组是否翻转, 默认false(按正常尾部添加的顺序显示数组)
  • 控制返回的数组是否翻转也可以直接在方法中使用unshift方法替换push实现同样效果,本次不做演示

参数为对象,属性名需对应方法内argumentsObj对象

返回数据

  • 参数组合繁多,应用场景广泛,下列数据为(无参-默认数据),具体使用方法可根据业务场景自由扩展。

代码注释详解

ini 复制代码
const leFn = (param = {}) => {
  // 定义默认对象
  let argumentsObj = {
    directionFlag: "after",
    fewDays: 7,
    dateType: "-",
    weekType: "星期",
    zeroFillFlag: true,
    reverseFlag: false,
  };
  // 解决严格模式下的未知位数参数问题
     argumentsObj = { ...argumentsObj, ...param };
   
  // 使用Object.assign()方法合并两个对象,b对象的属性会覆盖a对象的相同属性
  // 备用方案 argumentsObj = Object.assign({}, argumentsObj, param);
  
  // 获取当前时间戳
  let time = new Date().getTime();
  // 计算一天的毫秒数
  let oneDay = 60 * 60 * 24 * 1000;
  // 定义一个数组来存储一周的顺序文字
  let weekTxtList = ["日", "一", "二", "三", "四", "五", "六"];
  // 定义星期数组
  let weekList = [];
  // 依照fewDays参数循环生成指定天数的日期并添加进weekList数组
  for (let i = 1; i <= Number(argumentsObj.fewDays); i++) {
    // 依照directionFlag参数计算指定天数的时间戳
    let countTime =
      argumentsObj.directionFlag == "after"
        ? time + i * oneDay
        : time - i * oneDay;
    // 数字补零
    let Y = new Date(countTime).getFullYear();
    let M = new Date(countTime).getMonth() + 1;
    let zeroFillM = M > 9 ? M : "0" + M;
    let D = new Date(countTime).getDate();
    let zeroFillD = D > 9 ? D : "0" + D;
    // dateType控制间隔
    // zeroFillFlag控制补零
    // weekType控制周/星期相关类型文字
    // 此处date略显散乱  总结一眼公式即:  年+ 时间间隔符 + 月(是否补零)+ 时间间隔符+ 日(是否补零)
    // week即: 周/星期相关前缀文字 + 当前的周文字
    // new Date(countTime).getDay()得到周数字相关,通过定义的weekTxtList数组取到当前的周文字
    weekList.push({
      date: `${Y}${argumentsObj.dateType}${
        argumentsObj.zeroFillFlag ? zeroFillM : M
      }${argumentsObj.dateType}${argumentsObj.zeroFillFlag ? zeroFillD : D}`,
      week: argumentsObj.weekType + weekTxtList[new Date(countTime).getDay()],
    });
  }
  // 是否翻转数组
  return argumentsObj.reverseFlag ? (weekList = weekList.reverse()) : weekList;
};
console.log(leFn());
相关推荐
Carlos_sam1 分钟前
OpenLayers:ol-wind之渲染风场图全解析
前端·javascript
拾光拾趣录10 分钟前
闭包:从“变量怎么还没死”到写出真正健壮的模块
前端·javascript
拾光拾趣录30 分钟前
for..in 和 Object.keys 的区别:从“遍历对象属性的坑”说起
前端·javascript
OpenTiny社区41 分钟前
把 SearchBox 塞进项目,搜索转化率怒涨 400%?
前端·vue.js·github
编程猪猪侠1 小时前
Tailwind CSS 自定义工具类与主题配置指南
前端·css
qhd吴飞1 小时前
mybatis 差异更新法
java·前端·mybatis
YGY Webgis糕手之路2 小时前
OpenLayers 快速入门(九)Extent 介绍
前端·经验分享·笔记·vue·web
患得患失9492 小时前
【前端】【vueDevTools】使用 vueDevTools 插件并修改默认打开编辑器
前端·编辑器
ReturnTrue8682 小时前
Vue路由状态持久化方案,优雅实现记住表单历史搜索记录!
前端·vue.js
UncleKyrie2 小时前
一个浏览器插件帮你查看Figma设计稿代码图片和转码
前端