常見(jiàn)的javascript日期和時(shí)間戳互相轉(zhuǎn)化

morgan 發(fā)布于2019-08-26 17:44 / 1432人閱讀

摘要：寫(xiě)在前面前兩天寫(xiě)了一篇常見(jiàn)的獲取時(shí)間戳，今天來(lái)一篇續(xù)集吧，日期和時(shí)間戳的互轉(zhuǎn)預(yù)備知識(shí)知道什么是時(shí)間戳即距離年月日時(shí)分秒的毫秒數(shù)如果你要用到的是秒，那也行，單位問(wèn)題而已。同樣的道理要會(huì)把時(shí)間戳轉(zhuǎn)化成我們想要的日期格式。

寫(xiě)在前面

前兩天寫(xiě)了一篇《常見(jiàn)的Javascript獲取時(shí)間戳》，今天來(lái)一篇續(xù)集吧，日期和時(shí)間戳的互轉(zhuǎn)

預(yù)備知識(shí)

知道什么是時(shí)間戳：即距離1970年01月01日00時(shí)00分00秒的毫秒數(shù)（如果你要用到的是秒，那也行，單位問(wèn)題而已）。

知道為什么需要把日期轉(zhuǎn)化成時(shí)間戳：對(duì)于前端來(lái)說(shuō)，接觸的到的時(shí)間多是2018-08-08這種形式的，但是在拉取后端數(shù)據(jù)時(shí)，一般要把時(shí)間轉(zhuǎn)化成時(shí)間戳再傳過(guò)去。同樣的道理要會(huì)把時(shí)間戳轉(zhuǎn)化成我們想要的日期格式。

時(shí)間 -> 時(shí)間戳 (2018/08/09 10:10:10 -> 1533780610000 )

通常我們用到的時(shí)間格式分兩種2018/08/09 10:10:10或者2018-08-09 10:10:10，幸運(yùn)的是js的Date對(duì)象很好的支持了這種格式的時(shí)間，通常我們可以通過(guò)

new Date("2018/08/09 10:10:10").getTime()或者
new Date("2018-08-09 10:10:10").getTime()來(lái)獲取到時(shí)間戳

但是！！！！
ie對(duì)于第二種不支持
如下圖：

因此，請(qǐng)采用以下的代碼

let time = "2018-08-09 10:10:10"
time = time.replace(/-/g, "/") // 把所有-轉(zhuǎn)化成/
let timestamp = new Date(time).getTime()

時(shí)間戳 -> 時(shí)間 (1533780610000 -> 2018/08/09 10:10:10)

這里要用到Date對(duì)象的一系列g(shù)et方法,思路是先根據(jù)時(shí)間戳new一個(gè)Date對(duì)象，然后通過(guò)一系列g(shù)et方法分別拿到年月日時(shí)分秒，再拼接字符串。

function timestampToTime (timestamp) {
    const dateObj = new Date(+timestamp) // ps, 必須是數(shù)字類(lèi)型，不能是字符串, +運(yùn)算符把字符串轉(zhuǎn)化為數(shù)字，更兼容
    const year = dateObj.getFullYear() // 獲取年，
    const month = dateObj.getMonth() + 1 // 獲取月，必須要加1，因?yàn)樵路菔菑?開(kāi)始計(jì)算的
    const date = dateObj.getDate() // 獲取日，記得區(qū)分getDay()方法是獲取星期幾的。
    const hours = pad(dateObj.getHours())  // 獲取時(shí), pad函數(shù)用來(lái)補(bǔ)0
    const minutes =  pad(dateObj.getMinutes()) // 獲取分
    const seconds =  pad(dateObj.getSeconds()) // 獲取秒
    return year + "-" + month + "-" + date + " " + hours + ":" + minutes + ":" + seconds
}

function pad(str) {
    return +str >= 10 ? str : "0" + str
}

timestampToTime(1533773345000)
timestampToTime(1533780610000)

總結(jié)

有幾個(gè)小點(diǎn)需要注意

為了兼容，將橫線換成斜杠(2018-08-09 10:10:10 => 2018/08/09 10:10:10)

獲取月份時(shí)，要加1

getDate獲取日期，getDay是用來(lái)獲取是一個(gè)星期的第幾天

根據(jù)需求做適當(dāng)?shù)难a(bǔ)0，2018-8-9 08:09:05 要比 2018-8-9 8:9:5好看的多。