JS生成时间列表并输出

这次给大家带来JS生成时间列表输出,JS生成时间列表并输出的注意事项有哪些,下面就是实战案例,一起来看一下。

遇到一个场景,需要拿到指定时间范围内的每一天,满足格式”YYYYMMDD”,简单的功能,简单的思路

准备

   date对象有很多的方法,用到了以下:

   new date ()生成date对象,可以直接指定年月日等,new date(year,month,day)

   getFullYear() 返回date对象中的年份

   getMonth() 返回date对象中的月份(0~11),注意从0开始计

   getDate() 返回date对象中的天,注意从 1 开始计

      getTime() 返回1970年1月1日到date对象的毫秒数

解析指定范围

规定按照 yyyy-mm-dd格式字符串输入时间范围,split分割即可得到开始和结束时间的年月日,再生成对应的date对象,拿到毫秒数

 let st = start.split('-'); let et = end.split('-'); let startTime = new Date(st[0],st[1]-1,st[2]).getTime(); let endTime = new Date(et[0],et[1]-1,et[2]).getTime();

登录后复制

  注意 : 月份需要减 1 ,因为是从0开始计的

拿到每一天

  如何知道时间范围内有那些天呢?上面有了开始和结束时间距离1970.1.1的毫秒数,每一天有24 * 60 * 60 * 1000的毫秒数,所以我们可以通过毫秒数计算出每一天

  for( let i = startTime ; i <= endTime ; ){    res.push(formatTime(i,''));    i += 24 * 60 * 60 * 1000;  }

登录后复制

格式化输出

  将时间格式化,个位数字补0,加上指定的分割符

function formatTime(time,spliter = '-'){  let date = new Date(time);  let year = date.getFullYear();  let month = (date.getMonth() + 1) >= 10 ? (date.getMonth() + 1) : '0' + (date.getMonth() + 1);  let day = date.getDate() >= 10 ? date.getDate() : '0' + date.getDate();  return `${year}${spliter}${month}${spliter}${day}}

登录后复制

验证

JS生成时间列表并输出 

相信看了本文案例你已经掌握了方法,更多精彩请关注【创想鸟】其它相关文章!

推荐阅读:

react-native封装插件swiper使用步骤详解

FIFO/LRU实现缓存算法

以上就是JS生成时间列表并输出的详细内容,更多请关注【创想鸟】其它相关文章!

版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌抄袭侵权/违法违规的内容, 请发送邮件至253000106@qq.com举报,一经查实,本站将立刻删除。

发布者:PHP中文网,转转请注明出处:https://www.chuangxiangniao.com/p/2762986.html

(0)
上一篇 2025年3月8日 10:05:10
下一篇 2025年3月8日 10:05:17

AD推荐 黄金广告位招租... 更多推荐

相关推荐

  • nodejs+express实现文件上传案例详解

    这次给大家带来nodejs+express实现文件上传案例详解,nodejs+express实现文件上传的注意事项有哪些,下面就是实战案例,一起来看一下。 前段时间在做个人项目的时候,用到了nodejs服务端上传文件,现在回头把这个小结一下…

    编程技术 2025年3月8日
    100
  • angularjs自定义缓存使用案例详解

    这次给大家带来angularjs自定义缓存使用案例详解,angularjs自定义缓存使用的注意事项有哪些,下面就是实战案例,一起来看一下。 一、什么是缓存 一个缓存就是一个组件,它可以透明地存储数据,以便未来可以更快地服务于请求。 缓存能够…

    编程技术 2025年3月8日
    200
  • 原生JS封装淡入淡出效果函数步骤详解

    这次给大家带来原生JS封装淡入淡出效果函数步骤详解,原生JS封装淡入淡出效果函数的注意事项有哪些,下面就是实战案例,一起来看一下。 说到js的渐变显示与消失,多数朋友会想到JQuery里面的fadeIn()、fadeOut()或fadeTo…

    2025年3月8日
    200
  • p5.js键盘交互函数总结

    这次给大家带来p5.js键盘交互函数总结,使用p5.js键盘交互函数的注意事项有哪些,下面就是实战案例,一起来看一下。 一、键盘交互相关关键词与函数 keyIsPressed: 关键词,按下按键时为true,反之为false keyCode…

    编程技术 2025年3月8日
    200
  • JS原型与原型链使用详解

    这次给大家带来JS原型与原型链使用详解,JS原型与原型链使用的注意事项有哪些,下面就是实战案例,一起来看一下。 我们创建的每个函数都有一个 prototype (原型)属性,这个属性是一个指针,指向一个原型对象,而这个原型对象中拥有的属性和…

    2025年3月8日
    200
  • JS字符串的操作详解

    这次给大家带来JS字符串的操作详解,JS字符串操作的注意事项有哪些,下面就是实战案例,一起来看一下。 charAt()            获取字符串中特定索引处的字符; toupperCase()  将字符串的所有字符转换成大写字母; …

    编程技术 2025年3月8日
    200
  • js中DOM事件绑定使用小技巧

    这次给大家带来js中DOM事件绑定使用小技巧,js中DOM事件绑定使用的注意事项有哪些,下面就是实战案例,一起来看一下。 js事件绑定 JavaScript 有三种事件模型: 内联模型 脚本模型 DOM2 模型 1、内联模型 //基本废除不…

    编程技术 2025年3月8日
    200
  • js解析数据技巧总结

    这次给大家带来js解析数据技巧总结,js解析数据的注意事项有哪些,下面就是实战案例,一起来看一下。 自从有了前后端分离,一些后端小伙伴给出的数据结构也来越混乱了。以为分离减轻了他们的负担接口的质量会非常高但是人的惰性却体现的很“完美”。 由…

    编程技术 2025年3月8日
    200
  • vue.js路由失效无法使用

    这次给大家带来vue.js路由失效无法使用,解决vue.js路由失效无法使用的注意事项有哪些,下面就是实战案例,一起来看一下。 新学了vue.js中的路由 在之前写的vue的demo上加上了简单的路由例子(来自vue-router 2),但…

    编程技术 2025年3月8日
    200
  • JS给动态创建元素添加事件步骤详解

    这次给大家带来JS给动态创建元素添加事件步骤详解,JS给动态创建元素添加事件的注意事项有哪些,下面就是实战案例,一起来看一下。 html中直接生成的元素,添加事件,我们都知道,但是如何为一个动态生成的元素添加事件呢,jquery中的live…

    2025年3月8日
    200

发表回复

登录后才能评论