JS獲取當(dāng)前時(shí)間戳與時(shí)間戳轉(zhuǎn)日期時(shí)間格式問題
JS獲取當(dāng)前時(shí)間戳與時(shí)間戳轉(zhuǎn)日期時(shí)間格式
一、獲取當(dāng)前時(shí)間的時(shí)間戳(三種方式)
const t1 = new Date().valueOf() // 第一種,推薦 const t2 = new Date().getTime() // 第二種,推薦 const t3 = Date.parse(new Date()) // 第三種,不推薦,精度差一些
注: new Date()得到的是一個(gè)時(shí)間對(duì)象
const times = new Date() // Sat Apr 16 2022 11:07:38 GMT+0800 (中國(guó)標(biāo)準(zhǔn)時(shí)間)
二、獲取指定日期,時(shí)間的時(shí)間戳
const t = new Date('日期時(shí)間').valueOf() // 方法一 const t1 = new Date('日期時(shí)間').getTime() // 方法二 const t2 = new Date('2022-04-15').valueOf() // 1649980800000 const t3 = new Date('2022-04-15 12:15:36').valueOf() // 1649996136000 const t4 = new Date('2022-04-15').getTime() // 1649980800000 const t5 = new Date('2022-04-15 12:15:36').getTime() //
三、時(shí)間戳轉(zhuǎn)日期時(shí)間(vue項(xiàng)目中)
1. 創(chuàng)建一個(gè)date.js文件 ( src/util/date.js)
// 給Date類添加了一個(gè)新的實(shí)例方法format Date.prototype.format = function (fmt) { // debugger; let o = { 'M+': this.getMonth() + 1, // 月份 'd+': this.getDate(), // 日 'h+': this.getHours(), // 小時(shí) 'm+': this.getMinutes(), // 分 's+': this.getSeconds(), // 秒 'q+': Math.floor((this.getMonth() + 3) / 3), // 季度 S: this.getMilliseconds() // 毫秒 } if (/(y+)/.test(fmt)) { fmt = fmt.replace( RegExp.$1, (this.getFullYear() + '').substr(4 - RegExp.$1.length) ) } for (let k in o) { if (new RegExp('(' + k + ')').test(fmt)) { fmt = fmt.replace( RegExp.$1, RegExp.$1.length === 1 ? o[k] : ('00' + o[k]).substr(('' + o[k]).length) ) } } return fmt } // date: 時(shí)間對(duì)象, pattern: 日期格式 export function formatterDate (date, pattern) { let ts = date.getTime() let d = new Date(ts).format('yyyy-MM-dd hh:mm:ss') // 默認(rèn)日期時(shí)間格式 yyyy-MM-dd hh:mm:ss if (pattern) { d = new Date(ts).format(pattern) } return d.toLocaleString() }
2. 組件里面引入
3. 作為過濾器使用
<template> <div> <p>日期時(shí)間: {{times | formatterTime('yyyy-MM-dd hh:mm:ss')}}</p> <p>日期: {{times | formatterTime('yyyy-MM-dd')}}</p> <p>日期: {{times | formatterTime('yyyy年MM月dd日')}}</p> </div> </template> <script> import { formatterDate } from '@/util/date.js' export default { data() { return { times: new Date().valueOf()// 獲取當(dāng)前時(shí)間戳 } }, filters: { formatterTime(val,type) { // val: 時(shí)間戳 (val是通道數(shù)據(jù) 即過濾器前面的數(shù)據(jù),type是過濾器函數(shù)傳遞的參數(shù)) if (!val) return null const t = new Date(val) return formatterDate(t, type) // 日期時(shí)間 } } } </script>
頁(yè)面效果如下圖:
補(bǔ)充:
JavaScript 格式轉(zhuǎn)換 獲取當(dāng)前時(shí)間戳 時(shí)間戳和日期格式的轉(zhuǎn)換
一、格式轉(zhuǎn)換:前端時(shí)間格式2020-02-11T12:24:18.000+0000轉(zhuǎn)化成正常格式
function renderTime(date) { var dateee = new Date(date).toJSON(); return new Date(+new Date(dateee) + 8 * 3600 * 1000).toISOString().replace(/T/g, ' ').replace(/\.[\d]{3}Z/, '') }
轉(zhuǎn)換完成之后的格式為:2020-02-11 12:24:18
二、獲取當(dāng)前時(shí)間戳的方法
第一種方法: var timestamp = Date.parse(new Date()); 結(jié)果:1477808630000 不推薦這種辦法,毫秒級(jí)別的數(shù)值被轉(zhuǎn)化為000 第二種方法: var timestamp = (new Date()).valueOf(); 結(jié)果:1477808630404 通過valueOf()函數(shù)返回指定對(duì)象的原始值獲得準(zhǔn)確的時(shí)間戳值 第三種方法: var timestamp=new Date().getTime(); 結(jié)果:1477808630404 ,通過原型方法直接獲得當(dāng)前時(shí)間的毫秒值,準(zhǔn)確 第四種方法: var timestamp4=Number(new Date()); 結(jié)果:1477808630404 ,將時(shí)間轉(zhuǎn)化為一個(gè)number類型的數(shù)值,即時(shí)間戳
三、時(shí)間戳轉(zhuǎn)時(shí)間
方法1:
var time = new Date(1526572800000); //直接用 new Date(時(shí)間戳) 格式轉(zhuǎn)化獲得當(dāng)前時(shí)間 console.log(time); // VM626:2 Fri May 18 2018 00:00:00 GMT+0800 (中國(guó)標(biāo)準(zhǔn)時(shí)間) var times = time.toLocaleDateString().replace(/\//g,"-")+" "+time.toTimeString().substr(0,8); //再利用拼接正則等手段轉(zhuǎn)化為yyyy-MM-dd hh:mm:ss 格式 console.log(times); // 2018-5-18 00:00:00 不過這樣轉(zhuǎn)換在某些瀏覽器上會(huì)出現(xiàn)不理想的效果,因?yàn)閠oLocaleDateString()方法是因?yàn)g覽器而異的,比如 IE為2016年8月24日 22:26:19 格式 搜狗為Wednesday, August 24, 2016 22:39:42, 可以通過分別獲取時(shí)間的年月日進(jìn)行拼接,如方法2
方法2:
var now = new Date(1526572800000), y = now.getFullYear(), m = now.getMonth() + 1, d = now.getDate(), x = y + "-" + (m < 10 ? "0" + m : m) + "-" + (d < 10 ? "0" + d : d) + " " + now.toTimeString().substr(0, 8); console.log(x); // 2018-05-18 00:00:00
到此這篇關(guān)于JS獲取當(dāng)前時(shí)間戳與時(shí)間戳轉(zhuǎn)日期時(shí)間格式的文章就介紹到這了,更多相關(guān)js獲取當(dāng)前時(shí)間戳內(nèi)容請(qǐng)搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關(guān)文章希望大家以后多多支持腳本之家!
相關(guān)文章
bootstrap實(shí)現(xiàn)tab選項(xiàng)卡切換
這篇文章主要為大家詳細(xì)介紹了bootstrap實(shí)現(xiàn)tab選項(xiàng)卡切換,文中示例代碼介紹的非常詳細(xì),具有一定的參考價(jià)值,感興趣的小伙伴們可以參考一下2020-08-08js 獲取和設(shè)置css3 屬性值的實(shí)現(xiàn)方法
本篇文章介紹了,使用js 獲取和設(shè)置css3 屬性值的實(shí)現(xiàn)方法。需要的朋友參考下2013-05-05javascript實(shí)現(xiàn)圖片輪換動(dòng)作方法
這篇文章主要介紹了javascript實(shí)現(xiàn)圖片輪換動(dòng)作方法,文章通過示例代碼介紹的非常詳細(xì),對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值,需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧2020-08-08layui 關(guān)閉open彈出框 刷新table表格頁(yè)面的方法
今天小編就為大家分享一篇layui 關(guān)閉open彈出框 刷新table表格頁(yè)面的方法,具有很好的參考價(jià)值,希望對(duì)大家有所幫助。一起跟隨小編過來看看吧2019-09-09解決webpack dev-server不能匹配post請(qǐng)求的問題
這篇文章主要介紹了解決webpack不能匹配post請(qǐng)求的問題,小編覺得挺不錯(cuò)的,現(xiàn)在分享給大家,也給大家做個(gè)參考。一起跟隨小編過來看看吧2018-08-08

JavaScript實(shí)戰(zhàn)(原生range和自定義特效)簡(jiǎn)單實(shí)例

javascript 初學(xué)教程及五子棋小程序的簡(jiǎn)單實(shí)現(xiàn)