JavaScript中Date對(duì)象的那些事兒

擊右上方紅色按鈕關(guān)注“web秀”，讓你真正秀起來

前言

任何事情都離不開時(shí)間，太陽(yáng)每天升起的時(shí)間，每天你上班的時(shí)間，中午吃飯時(shí)間等等。在編程生涯中，無(wú)時(shí)無(wú)刻都有一個(gè)時(shí)間來引導(dǎo)，如數(shù)據(jù)創(chuàng)建時(shí)間（createTime）,更新時(shí)間（updateTime）等。今天來說說JavaScript的Date對(duì)象。

開始

var date = new Date();

這時(shí)的時(shí)間是當(dāng)前時(shí)間。

那么Date都可以用什么來作為參數(shù)呢？

1、Date對(duì)象可以使用指定時(shí)間到1970年1月1日00:00:00 UTC的毫秒數(shù)做參數(shù)。

JavaScript中Date對(duì)象的那些事兒

看到上面的結(jié)果是不是有點(diǎn)奇怪，當(dāng)參數(shù)為0時(shí)返回的不應(yīng)該是1970年1月1日00:00:00嗎?這里應(yīng)該是使用了格林尼治標(biāo)準(zhǔn)時(shí)間作為計(jì)時(shí)標(biāo)準(zhǔn)，中國(guó)的時(shí)間比格林威治標(biāo)準(zhǔn)時(shí)間快8個(gè)小時(shí)，所以就是8點(diǎn)，而不是0點(diǎn)啦。（突然想到周董的一段歌詞，“我占據(jù)格林威治守候著你，在時(shí)間標(biāo)準(zhǔn)起點(diǎn)回憶過去，你卻在永夜了的極地旅行”，格林威治是世界計(jì)算時(shí)間和地理經(jīng)度的起點(diǎn)，但是現(xiàn)在GMT時(shí)間已經(jīng)不再被科學(xué)界確定，還有一個(gè)最接近GMT的世界時(shí)間標(biāo)準(zhǔn)，就是UTC啦）

2、參數(shù)也可以是（年，月，日，時(shí)，分，秒），其中至少需要兩個(gè)整數(shù)，否則就會(huì)被當(dāng)做1中例子里的毫秒數(shù)了。

這里的月份是0～11，所以下面的例子月份為5時(shí) June六月

JavaScript中Date對(duì)象的那些事兒

當(dāng)然，這里的參數(shù)也可以是負(fù)數(shù)，就表示相對(duì)當(dāng)前設(shè)定時(shí)間扣掉的時(shí)間。比如下圖第一個(gè)例子，月份使用了負(fù)數(shù)，于是就從2018年1月1日為基準(zhǔn)，扣掉五個(gè)月，變?yōu)榱?018年8月

JavaScript中Date對(duì)象的那些事兒

3、我們?cè)倏纯?,1，-1這三個(gè)特殊數(shù)字做參數(shù)的情況。如果年份使用0，則表示的是1900年，為負(fù)數(shù)就變成了公元前。

JavaScript中Date對(duì)象的那些事兒

4、當(dāng)然，除了整數(shù)，還可以用日期的字符串作為參數(shù)

JavaScript中Date對(duì)象的那些事兒

任意搭配都可以得到正確的時(shí)間，棒棒噠！

Date對(duì)象中有很多方法，這里我只挑一些常用的來說下。

1、Date() 返回當(dāng)前的時(shí)間

JavaScript中Date對(duì)象的那些事兒

無(wú)論你在中間加什么參數(shù)，永遠(yuǎn)返回當(dāng)前時(shí)間

2、getDate() 返回指定時(shí)間的某一天（1～31）

getDay() 返回指定時(shí)間的星期數(shù)（0～6）

getMonth() 返回指定時(shí)間的月份（0～11）

getFullYear() 返回指定時(shí)間的四位數(shù)年份

getHours() 返回指定時(shí)間的小時(shí)（0～23）

getMinutes() 返回指定時(shí)間的分鐘數(shù)（0～59）

getSeconds() 返回指定時(shí)間的秒數(shù)（0～59）

getMilliseconds() 返回指定時(shí)間的毫秒數(shù)（0～999）

JavaScript中Date對(duì)象的那些事兒

3、getTime() 返回1970年1月1日00:00:00到指定時(shí)間的毫秒數(shù)，就是UNIX時(shí)間數(shù)的1000倍

JavaScript中Date對(duì)象的那些事兒

也就是說，UNIX時(shí)間和時(shí)間字符串相互轉(zhuǎn)換可以這樣

JavaScript中Date對(duì)象的那些事兒

除了getTime()，將時(shí)間字符串轉(zhuǎn)換成毫秒數(shù)的方法還有+Date()、Number(Date)和Date.parse()

Date()和new Date()

上面的例子里有用到Date()和new Date()，返回結(jié)果的狀態(tài)也是不同的，在這里總結(jié)一下。，Date()無(wú)論有沒有參數(shù)都是返回的當(dāng)前時(shí)間的字符串，而new Date()會(huì)根據(jù)參數(shù)返回對(duì)應(yīng)時(shí)間的字符串

分分鐘寫個(gè)小日歷

使用Date()對(duì)象的一個(gè)簡(jiǎn)單的應(yīng)用當(dāng)然就是寫日歷了～

首先，我們需要判斷當(dāng)前月份的第一天是星期幾

var date = new Date();
var year = date.getFullYear();
var month = date.getMonth();
var firstDay,
 getFirstDay;
function getFirstDay (year, month) {
 firstDay = new Date(year, month, 1);
 getFirstDay = firstDay.getDay();
}

然后再判斷當(dāng)前月份的天數(shù)。選用的辦法是使用當(dāng)前月份下個(gè)月的1日的時(shí)間減去1個(gè)小時(shí)，這樣就回到了當(dāng)前月份最后一天，再獲取當(dāng)前日期即可。

function getMonthDays (year, month) {
 var nextMonth = new Date(year, month + 1, 1),
 getMonthDays;
 nextMonth.setHours(nextMonth.getHours() - 1);
 getMonthDays = nextMonth.getDate();
}

剩下的就是將數(shù)據(jù)填充到表格里就可以啦～

但是日歷并不只能看當(dāng)前月份，還可以查前一個(gè)月后一個(gè)月，那么只需要加兩個(gè)按鈕，點(diǎn)擊后月份減1或加1即可。

具體代碼在下面～

https://github.com/yanagao/Date.git

1970年的元旦

眾所周知，所有的編程語(yǔ)言都是要從1970年1月1日開始計(jì)算時(shí)間，這個(gè)時(shí)間是有什么特殊的含義嗎？在1970年的元旦0點(diǎn)0分0秒到底發(fā)生了什么？

上面我們提到了一個(gè)UNIX時(shí)間，就是指從1970年1月1日0時(shí)0分0秒起至現(xiàn)在的總秒數(shù)。我們都知道，系統(tǒng)有32位也有64位，那么如果把UNIX時(shí)間用32位二進(jìn)制數(shù)表示，只能夠表示到2147483647秒，也就是到Tue Jan 19 2038 11:14:07 這個(gè)時(shí)間就是極限了，超過這個(gè)時(shí)間，就會(huì)變成負(fù)數(shù)，系統(tǒng)就掛了。在以前那個(gè)只有32位操作系統(tǒng)的年代，可能覺得38年之前就會(huì)有解決辦法吧(⊙﹏⊙)b。年初的時(shí)候流傳了iPhone變磚的方法，如果你把iPhone的系統(tǒng)時(shí)間調(diào)到1970年1月1日，重啟手機(jī)就變磚了，不舍得用自己手機(jī)試驗(yàn)的同學(xué)紛紛去了蘋果體驗(yàn)店。有網(wǎng)友就猜測(cè)，因?yàn)橹袊?guó)在東8區(qū)，比格林威治時(shí)間快8個(gè)小時(shí)，也就是說北京時(shí)間1970年1月1日00:00:00對(duì)應(yīng)的是1969年12月31日16:00:00，UNIX時(shí)間為負(fù)，所以手機(jī)變磚，但是沒法證實(shí)這個(gè)猜測(cè)的正確性┑(￣Д ￣)┍。

現(xiàn)在的操作系統(tǒng)大部分都為64位，可以表示至少到263，經(jīng)過各種不嚴(yán)密計(jì)算，可以算出64位二進(jìn)制至少可以表示2924.7億年，應(yīng)該就不用擔(dān)心系統(tǒng)掛掉的問題了┑(￣Д ￣)┍。

公告

喜歡小編的點(diǎn)擊關(guān)注，了解更多知識(shí)！

構(gòu)建的應(yīng)用程序的時(shí)候都會(huì)帶有日期時(shí)間組件，無(wú)論是資源的創(chuàng)建日期還是活動(dòng)的時(shí)間戳。在本文中，我將分享如何在JavaScript中以各種格式獲取當(dāng)前日期。

1、JavaScript的Date對(duì)象

const date = new Date();

該Date對(duì)象包含一個(gè)Number，表示從新紀(jì)元（即1970年1月1日）起經(jīng)過的毫秒數(shù)。你可以將日期字符串傳遞給Date構(gòu)造函數(shù)以創(chuàng)建指定日期的對(duì)象：

const date = new Date('Jul 12 2011');

要獲取當(dāng)前年份，可以使用對(duì)象的getFullYear()方法。getFullYear()方法在Date構(gòu)造函數(shù)中返回指定日期的年份：

const currentYear = date.getFullYear();
console.log(currentYear); //2020

同樣，有一些方法可以獲取當(dāng)月的當(dāng)前日期和當(dāng)前的月份：

const today = date.getDate();
const currentMonth = date.getMonth() + 1;

該getDate()方法返回每月的當(dāng)前日期（1-31）。使用getMonth()方法返回指定日期的月份，需要注意的一點(diǎn)是，該方法返回0索引值（0-11），其中0表示一月，11表示十二月。因此，加1可以使月份的值標(biāo)準(zhǔn)化。

2、Date now

now()是Date對(duì)象的靜態(tài)方法。它以毫秒為單位的值返回，該值表示從紀(jì)元以來所經(jīng)過的時(shí)間。你可以將now()方法返回的毫秒數(shù)傳遞給Date構(gòu)造函數(shù)以實(shí)例化新Date對(duì)象：

const timeElapsed = Date.now();
const today = new Date(timeElapsed);

3、格式化日期

你可以使用Date對(duì)象的方法將日期格式化為多種格式（GMT，ISO等）。該toDateString()方法以我們可讀的格式返回日期：

today.toDateString(); // "Sun Jun 16 2020"

toISOString()返回遵循ISO 8601擴(kuò)展格式的日期：

today.toISOString(); // "2020-06-16T08:30:00.000Z"

toUTCString()以UTC時(shí)區(qū)格式返回日期：

today.toUTCString(); // "Sat, 16 Jun 2020 08:30:00 GMT"

toLocaleDateString()以地區(qū)區(qū)時(shí)的格式返回日期：

today.toLocaleDateString(); // "6/16/2020"

4、自定義日期格式器功能

除了上面提到的格式外，你的應(yīng)用程序可能具有不同的數(shù)據(jù)格式。它可以是yy/dd/mm或yyyy-dd-mm格式，或者類似的格式。為了解決這個(gè)問題，最好創(chuàng)建一個(gè)可重用的函數(shù)，以便可以在多個(gè)項(xiàng)目中使用它。因此，接下來，讓我們創(chuàng)建一個(gè)實(shí)用程序函數(shù)，該函數(shù)將以函數(shù)參數(shù)中指定的格式返回日期：

const today = new Date();
function formatDate(date, format) {
    //
}
formatDate(today, 'mm/dd/yy');

你需要使用參數(shù)中傳遞格式字符串中的月份，日期和年份分別替換字符串“ mm”，“ dd”，“ yy”。然后，使用replace()，如下所示的方法：

format.replace('mm', date.getMonth() + 1);

但是，這將導(dǎo)致很多methods連接在一起，并且會(huì)讓我們嘗試把函數(shù)變得更靈活更適合我們的項(xiàng)目時(shí)產(chǎn)生麻煩：

  .replace('yy', date.getFullYear())
  .replace('dd', date.getDate());

然后可以使用正則表達(dá)式代替methods來連接methods replace()。首先創(chuàng)建一個(gè)對(duì)象，該對(duì)象將代表子字符串的鍵值對(duì)及其各自的值：

const formatMap = {
    mm: date.getMonth() + 1,
    dd: date.getDate(),
    yy: date.getFullYear().toString().slice(-2),
    yyyy: date.getFullYear()
};

接下來，使用正則表達(dá)式匹配并替換字符串：

formattedDate = format.replace(/mm|dd|yy|yyy/gi, matched => map[matched]);

完整的功能及代碼如下所示：

function formatDate(date, format) {
    const map = {
        mm: date.getMonth() + 1,
        dd: date.getDate(),
        yy: date.getFullYear().toString().slice(-2),
        yyyy: date.getFullYear()
    }
 
    return format.replace(/mm|dd|yy|yyy/gi, matched => map[matched])
}

你還可以在函數(shù)中添加格式化時(shí)間戳的功能。

5、最后

你現(xiàn)在對(duì)DateJavaScript 中的對(duì)象有更好的了解。你也可以使用其他第三方庫(kù)（例如datesj和）moment來處理應(yīng)用程序中的日期。

ate 對(duì)象

Date 對(duì)象用于處理日期與實(shí)際。

創(chuàng)建 Date 對(duì)象： new Date().

以上四種方法同樣可以創(chuàng)建 Date 對(duì)象：

var d = new Date();

var d = new Date(milliseconds);

var d = new Date(dateString);

var d = new Date(year, month, day, hours, minutes, seconds, milliseconds);

Date 對(duì)象屬性

屬性	描述
constructor	返回對(duì)創(chuàng)建此對(duì)象的 Date 函數(shù)的引用。
prototype	使您有能力向?qū)ο筇砑訉傩院头椒ā?/td>

Date 對(duì)象方法

方法	描述
getDate()	從 Date 對(duì)象返回一個(gè)月中的某一天 (1 ~ 31)。
getDay()	從 Date 對(duì)象返回一周中的某一天 (0 ~ 6)。
getFullYear()	從 Date 對(duì)象以四位數(shù)字返回年份。
getHours()	返回 Date 對(duì)象的小時(shí) (0 ~ 23)。
getMilliseconds()	返回 Date 對(duì)象的毫秒(0 ~ 999)。
getMinutes()	返回 Date 對(duì)象的分鐘 (0 ~ 59)。
getMonth()	從 Date 對(duì)象返回月份 (0 ~ 11)。
getSeconds()	返回 Date 對(duì)象的秒數(shù) (0 ~ 59)。
getTime()	返回 1970 年 1 月 1 日至今的毫秒數(shù)。
getTimezoneOffset()	返回本地時(shí)間與格林威治標(biāo)準(zhǔn)時(shí)間 (GMT) 的分鐘差。
getUTCDate()	根據(jù)世界時(shí)從 Date 對(duì)象返回月中的一天 (1 ~ 31)。
getUTCDay()	根據(jù)世界時(shí)從 Date 對(duì)象返回周中的一天 (0 ~ 6)。
getUTCFullYear()	根據(jù)世界時(shí)從 Date 對(duì)象返回四位數(shù)的年份。
getUTCHours()	根據(jù)世界時(shí)返回 Date 對(duì)象的小時(shí) (0 ~ 23)。
getUTCMilliseconds()	根據(jù)世界時(shí)返回 Date 對(duì)象的毫秒(0 ~ 999)。
getUTCMinutes()	根據(jù)世界時(shí)返回 Date 對(duì)象的分鐘 (0 ~ 59)。
getUTCMonth()	根據(jù)世界時(shí)從 Date 對(duì)象返回月份 (0 ~ 11)。
getUTCSeconds()	根據(jù)世界時(shí)返回 Date 對(duì)象的秒鐘 (0 ~ 59)。
getYear()	已廢棄。請(qǐng)使用 getFullYear() 方法代替。
parse()	返回1970年1月1日午夜到指定日期（字符串）的毫秒數(shù)。
setDate()	設(shè)置 Date 對(duì)象中月的某一天 (1 ~ 31)。
setFullYear()	設(shè)置 Date 對(duì)象中的年份（四位數(shù)字）。
setHours()	設(shè)置 Date 對(duì)象中的小時(shí) (0 ~ 23)。
setMilliseconds()	設(shè)置 Date 對(duì)象中的毫秒 (0 ~ 999)。
setMinutes()	設(shè)置 Date 對(duì)象中的分鐘 (0 ~ 59)。
setMonth()	設(shè)置 Date 對(duì)象中月份 (0 ~ 11)。
setSeconds()	設(shè)置 Date 對(duì)象中的秒鐘 (0 ~ 59)。
setTime()	setTime() 方法以毫秒設(shè)置 Date 對(duì)象。
setUTCDate()	根據(jù)世界時(shí)設(shè)置 Date 對(duì)象中月份的一天 (1 ~ 31)。
setUTCFullYear()	根據(jù)世界時(shí)設(shè)置 Date 對(duì)象中的年份（四位數(shù)字）。
setUTCHours()	根據(jù)世界時(shí)設(shè)置 Date 對(duì)象中的小時(shí) (0 ~ 23)。
setUTCMilliseconds()	根據(jù)世界時(shí)設(shè)置 Date 對(duì)象中的毫秒 (0 ~ 999)。
setUTCMinutes()	根據(jù)世界時(shí)設(shè)置 Date 對(duì)象中的分鐘 (0 ~ 59)。
setUTCMonth()	根據(jù)世界時(shí)設(shè)置 Date 對(duì)象中的月份 (0 ~ 11)。
setUTCSeconds()	setUTCSeconds() 方法用于根據(jù)世界時(shí) (UTC) 設(shè)置指定時(shí)間的秒字段。
setYear()	已廢棄。請(qǐng)使用 setFullYear() 方法代替。
toDateString()	把 Date 對(duì)象的日期部分轉(zhuǎn)換為字符串。
toGMTString()	已廢棄。請(qǐng)使用 toUTCString() 方法代替。
toISOString()	使用 ISO 標(biāo)準(zhǔn)返回字符串的日期格式。
toJSON()	以 JSON 數(shù)據(jù)格式返回日期字符串。
toLocaleDateString()	根據(jù)本地時(shí)間格式，把 Date 對(duì)象的日期部分轉(zhuǎn)換為字符串。
toLocaleTimeString()	根據(jù)本地時(shí)間格式，把 Date 對(duì)象的時(shí)間部分轉(zhuǎn)換為字符串。
toLocaleString()	據(jù)本地時(shí)間格式，把 Date 對(duì)象轉(zhuǎn)換為字符串。
toString()	把 Date 對(duì)象轉(zhuǎn)換為字符串。
toTimeString()	把 Date 對(duì)象的時(shí)間部分轉(zhuǎn)換為字符串。
toUTCString()	根據(jù)世界時(shí)，把 Date 對(duì)象轉(zhuǎn)換為字符串。
UTC()	根據(jù)世界時(shí)返回 1970 年 1 月 1 日到指定日期的毫秒數(shù)。
valueOf()	返回 Date 對(duì)象的原始值。

在線咨詢

上一篇：20個(gè)炫酷響應(yīng)式H5模板免費(fèi)下載
下一篇：HTML DOM Textarea 對(duì)象

您的項(xiàng)目需求

*請(qǐng)認(rèn)真填寫需求信息，我們會(huì)在24小時(shí)內(nèi)與您取得聯(lián)系。

整合營(yíng)銷服務(wù)商

JavaScript中Date對(duì)象的那些事兒

前言

開始

分分鐘寫個(gè)小日歷

公告

1、JavaScript的Date對(duì)象

2、Date now

3、格式化日期

4、自定義日期格式器功能

5、最后

您的項(xiàng)目需求