js中date對象的方法,JavaScript 關于 Date() 時間函數的運用以及方法封裝

 2023-10-04 阅读 22 评论 0

摘要:前言 此,主要是記錄自己平時會常用到的一些Date操作方法封裝,以及Date中比較好用的一些方法運用,希望能幫助到你。 學習路徑:MDN-Date(MDN上面有詳細的介紹屬性語法,感興趣可以點過去看看) 備注:當然外面也有很多成熟

前言

此,主要是記錄自己平時會常用到的一些Date操作方法封裝,以及Date中比較好用的一些方法運用,希望能幫助到你。

學習路徑:MDN-Date(MDN上面有詳細的介紹屬性語法,感興趣可以點過去看看)

備注:當然外面也有很多成熟好用的日期庫(官方推薦moment.js),如果你的項目日期方面使用的比較復雜頻繁,就沒必要自己去寫js了(自己有特殊需求的該寫的還得寫哈哈)

目錄??

1.獲取時間戳

2.獲取某年的第一天和最后一天的日期

3.獲取某年某月的第一天和最后一天的日期

4.從當前時間往后推年份,月份,天數

5.獲取某年的所有日期

6.獲取某月有多少周

7.當前日期是這個月的第幾周

8.獲取某年有多少周

9.當前日期是年的第幾周

10.根據周數取時間

11.閏年平年判斷

12.日期格式化


js中date對象的方法。

正文

1.獲取時間戳

      //(當前時間時間戳) 返回自 1970-1-1 00:00:00 至今所經過的毫秒數。Date.now();/*** 解析一個表示日期的字符串,并返回從 1970-1-1 00:00:00 所經過的毫秒數。* dateString:2022-10-10,2022-10,2022 都可以*///顯式調用:Date.parse(dateString); //*備注: 由于瀏覽器差異和不一致,強烈建議不要使用Date.parse解析字符串。//隱式調用:new Date(dateString).getTime();console.log(Date.now()); //1652068607028console.log(Date.parse("2022-10-10")); //1652068607028console.log(new Date("2022-10-10 10:00:00").getTime()); //1665367200000

2.獲取某年的第一天和最后一天的日期

      var date = new Date();// 某年第一天 2022/1/1 00:00:00console.log(new Date(date.getFullYear(), 0, 1));// 某年最后一天 2022/12/31 00:00:00console.log(new Date(date.getFullYear(), 12, 0));

3.獲取某年某月的第一天和最后一天的日期

      //備注:月份位置的傳值是從0-11,所以如果時截取的字符串記得要減一,如:2022-10-10var date = new Date();//某月第一天 2022/5/1 00:00:00console.log(new Date(date.getFullYear(), date.getMonth(), 1).toLocaleString());//某月最后天 2022/5/31 00:00:00console.log(new Date(date.getFullYear(), date.getMonth() + 1, 0).toLocaleString());

4.從當前時間往后推年份,月份,天數

    //備注:用Date自帶的實例方法去處理不用考慮每個月不同天數,返回的也是時間格式,不用格式轉來轉去var date= new Date();//2022/5/12 11:36:21 //往后推三年—— +-3date.setFullYear(date.getFullYear()-3);console.log(date.toLocaleString());//2019/5/12 11:35:56//往后推三個月—— +-3var date= new Date();//2022/5/12 11:38:32date.setMonth(date.getMonth()-3);console.log(date.toLocaleString(0));//2022/2/12 11:38:32//往后推三天—— +-3var date= new Date();//2022/5/12 11:38:32date.setDate(date.getDate()-3);console.log(date.toLocaleString(0));//2022/5/9 11:38:32

5.獲取某年的所有日期

      function getYear(date) {let o = {};let y = date.getFullYear();// var i = new Date(y, 0, 0);for (let m = 1; m <= 12; m++) {//單獨某月的日期for (let d = 1; d <= new Date(y, m, 0).getDate(); d++) {var t = y + "-" + replenish(m) + "-" + replenish(d); //**這種固定死了格式,如果要自定義格式可以用下面注釋這種方式// i.setDate(i.getDate() + 1);// var t = i.toLocaleString();//toLocaleString()是方便觀察,格式可以用文章下面的格式化方法formatDate()o[m] ? o[m].push(t) : (o[m] = [t]); //初始化}}return o;}function replenish(str) {var len = str.toString().length;return len < 2 ? "0" + str : str;}console.log(getYear(new Date())); //{1:['2022-01-01,...'],2:['2022-02-01...']...}

6.獲取某月有多少周

  //當前月的周對象function getCurrentMonthWeek(date) {var y = date.getFullYear();var m = date.getMonth();var w = new Date(y, m, 1).getDay();var o = {},  n = 1;for (let i = 1; i <= new Date(y, m + 1, 0).getDate(); i++) {if (i !== 1&&w === 1) n++;if (w === 7) w = 0;w++;var curDay = new Date(y, m, i); //也可以自己拼接就不用new了o[n] ? o[n].push(curDay) : (o[n] = [curDay]);}return o;}var date = new Date();console.log(getCurrentMonthWeek(new Date('2022-06-01')));//{1:[Wed Jun 01 2022 00:00:00 GMT+0800 (GMT+08:00)...], 2: Array(7), 3: Array(7), 4: Array(7), 5: Array(4)}

7.當前日期是這個月的第幾周

    //當前月的周對象 var date = new Date("2022-05-09");var weeks = getCurrentMonthWeek(date);//上面獲取月中周數的方法console.log(weeks);var ind = Object.values(weeks).findIndex((x) => ~x.indexOf(date.toLocaleDateString()));console.log(Object.keys(weeks)[ind]); //3

8.獲取某年有多少周

/*** 備注:我這里取某年第一周按照,星期四規則取,* 即當前一號小于或等于星期四那么上一年的最后幾天屬于當前年的第一周內,* 反之當前年前幾號時間屬于去年的最后一周*/var y = "2020";//**只返回對應年份的周數function getWeek(year) {var dt = new Date(year, 0, 1);var et = new Date(year, 12, 0).getTime(); //最后一天var d = dt.getDay() || 7;var w = d <= 4 ? 1 : 0; //周四在當前年份,那么跨年的那個星期就屬于當前年dt.setDate(dt.getDate() + (4 - d)); //當前年第一個周四while (true) {dt.setDate(dt.getDate() + 7); //下一周if (dt.getTime() > et) break;w += 1;}return w;}console.log(getWeek(y)); //53//**返回對應年份周數及對應的日期對象function getWeekNew(year) {var dt = new Date(year, 0, 1);var et = new Date(year, 12, 0).getTime();var d = dt.getDay() || 7;var w = 1;var o = {};//第一周的前一天(進循環會直接++所以取了前一天)if (d <= 4) dt.setDate(dt.getDate() - d);else dt.setDate(dt.getDate() + (7 - d));while (true) {dt.setDate(dt.getDate() + 1); //+1o[w]? o[w].push(dt.toLocaleDateString()) //dt.toLocaleDateString()這里的日期格式可以自己拼接,: (o[w] = [dt.toLocaleDateString()]); //或者使用本文下面的日期格式化方法toLocaleString_Date(dt),//最后一天小于星期四,刪除掉不完整的周()if (dt.getTime() === et && (dt.getDay() || 7) < 4) {delete o[w];return o;}//取整周if ((dt.getDay() || 7) == 7) {if (dt.getTime() >= et) return o;w += 1;}}}console.log(getWeekNew(y)); //{1:['2019/12/30', '2019/12/31', '2020/1/1'..],2:[...],...}

9.當前日期是年的第幾周

    //當前月的周對象function getCrrut(date) {var year = date.getFullYear();var weeks = getWeekNew(date.getFullYear());//上面的方法var month = date.getMonth();var ind = Object.values(weeks).findIndex((x) => ~x.indexOf(date.toLocaleDateString())//date.toLocaleDateString()這里取時間要跟weeks對象類型相同);if (~ind) return year + "年 第" + (ind + 1) + "周";//下面主要是防止取到年初或者年尾日期且不在當前年的周(weeks)對象內而出現0周的情況if (month < 11) {year -= 1;weeks = getWeekNew(year);ind = Object.values(weeks).findIndex((x) => ~x.indexOf(date.toLocaleDateString()));} else {year += 1;weeks = getWeekNew(year);ind = Object.values(weeks).findIndex((x) => ~x.indexOf(date.toLocaleDateString()));}return year + "年 第" + (ind + 1) + "周";}var date = new Date();console.log(getCrrut(date));

10.根據周數取時間

    //如果想根據周去取時間的話,那就通過 weeks對象去取var weeks = getWeekNew(date.getFullYear());//文本上面的方法//取第12周數據console.log(weeks[12]);//["2010/3/22","2010/3/23"...]

11.閏年平年判斷

      var day = new Date();//1.閏年平年判斷function getCommonYearsAndLeapYears(date) {try {var year = date.getFullYear();var n = year % 100 != 0 ? 4 : 400;console.log(year);return year % n == 0 ? "閏年" : "平年";} catch (error) {return alert("數據異常");}}//console.log( getCommonYearsAndLeapYears(new Date('2016')));

12.日期格式化

? ?*常規方法(下面還有有一個簡單點的處理方法)

      /**穩妥一點的辦法  yyyy-MM-dd hh:mm:ss* date:時間* type: yyyy-MM-dd hh:mm:ss* 當然如果有需要的話可以直接綁定到原型上面* Date.prototype.format=formatDate*/function formatDate(date = new Date(), type = "yyyy-MM-dd hh:mm:ss") {if (Object.prototype.toString.call(this) == "[object Date]")date = this;if (date == "Invalid Date")return alert("日期格式有問題");var o = {yyyy: date.getFullYear(), //年MM: date.getMonth() + 1, //月dd: date.getDate(), //日hh: date.getHours(), //24小時制HH: date.getHours() % 12 === 0 ? 12 : date.getHours() % 12, //12小時制mm: date.getMinutes(), //分ss: date.getSeconds(), //秒ms: date.getMilliseconds(), //毫秒};for (var i in o) {type = type.replaceAll(i, replenish(o[i]));}return type;}function replenish(str) {var len = str.toString().length;return len < 2 ? "0" + str : str;}/*** 有需要可以綁定到原型上(多人開發,有可能會命名沖突需要溝通好)* Date.prototype.format=formatDate;* console.log(new Date().format());//2022-05-09 16:37:28* 當作方法使用* console.log(formatDate("yyyy-MM-dd hh:mm:ss"));//2022-05-09 16:24:24*/console.log(formatDate()); //2022-05-09 16:24:24console.log(formatDate(new Date(), "yyyy年MM月dd日 wk"));//2022年05月09日 星期三

? ?*簡單使用方法 (如果要考慮兼容底版本瀏覽器,比如ie9已下之類不建議使用以下方法)

/*** 如果你的需求很簡單并且不怎么常用,不妨試試Date自帶的方法* 備注:下面的方法不兼容ie9以下的,如果要考慮兼容,可能不太行* Date.prototype.toLocaleDateString() :返回日期字符串 '2022/5/9'* Date.prototype.toLocaleString()  :返回整個日期對象字符串 '2022/5/9 16:43:03'* Date.prototype.toLocaleTimeString()  :返回時間字符串 '16:43:03'*/var date = new Date(); //options 根據屬性值顯示不同的效果,設置options后會覆蓋掉上面三個方法的默認顯示,所以我就舉toLocaleString一個例子var options = {// weekday: "long",//星期,慎用會影響其他字段的格式year: "numeric", //年month: "2-digit", //月day: "2-digit", //天hour: "numeric", //時hour12: false, //是否12小時制度minute: "numeric", //分second: "numeric", //秒};//顯示值就根據options參數決定,不要就注釋console.log(date.toLocaleString()); //2022/5/9 16:56:46console.log(date.toLocaleString(undefined, options)); //2022/05/09 16:59:21console.log(date.toLocaleString(undefined, options).replaceAll("/", "-")); //2022-05-09 16:59:21//取消options.weekday的注釋,日期后綴會被強制轉換console.log(date.toLocaleString(undefined, { ...options, weekday: "long" }));//2022年05月09日星期一 16:57:54// 擴展一下(大寫,農歷)//  var intl = new Intl.DateTimeFormat('zh-u-nu-hanidec-ca-chinese', options)// console.log(date.toLocaleDateString("zh-u-nu-hanidec", options));//大寫 二〇二二/〇五/〇九 一七:一五:四四// console.log(date.toLocaleDateString("zh-u-ca-chinese", options));//農歷 2022年四月09 17:15:44// console.log(date.toLocaleDateString('zh-u-nu-hanidec-ca-chinese', options))//大寫的農歷 二〇二二年四月〇九 一七:一五:四四// console.log(date.toLocaleDateString('zh-u-nu-hanidec-ca-chinese', options))//大寫的農歷(帶星期) 二〇二二壬寅年四月〇九,星期一 一七:四三:三二//使用頻繁的話用intl代替上面的調用可以提高性能// var intl = new Intl.DateTimeFormat('zh-u-ca-chinese', options)//2022年四月09 17:46:50// console.log(intl.format(date))

? * 方法封裝

    var options = {// weekday: "long",//星期,慎用會影響其他字段的格式year: "numeric", //年month: "2-digit", //月day: "2-digit", //天hour: "numeric", //時hour12: false, //是否12小時制度minute: "numeric", //分second: "numeric", //秒};var intl = new Intl.DateTimeFormat(undefined, options); //undefined 取默認語言function toLocaleString_Date(date) {return intl.format(date).replaceAll("/", "-");}console.log(toLocaleString_Date(new Date())); //2022-05-12 11:01:08,不需要時分秒可以自行調節options

js中引入date類,對上面options參數感興趣的點我

后續待補?

版权声明:本站所有资料均为网友推荐收集整理而来,仅供学习和研究交流使用。

原文链接:https://808629.com/119387.html

发表评论:

本站为非赢利网站,部分文章来源或改编自互联网及其他公众平台,主要目的在于分享信息,版权归原作者所有,内容仅供读者参考,如有侵权请联系我们删除!

Copyright © 2022 86后生记录生活 Inc. 保留所有权利。

底部版权信息