正則表達(dá)式在日期處理的一個(gè)應(yīng)用

roadtogeek 發(fā)布于2019-08-22 17:11 / 563人閱讀

摘要：下面實(shí)現(xiàn)日期格式的解析，要把傳入的日期格式做匹配，然后從對象解析出對應(yīng)的值，再拼到一塊。

最近在翻看原來寫的工具函數(shù)中，發(fā)現(xiàn)了formatDate這個(gè)工具函數(shù)，原來只是在使用，具體的實(shí)現(xiàn)原理沒有仔細(xì)研究過，這次就來分析一下它的實(shí)現(xiàn)，了解一下正則表達(dá)式的一個(gè)實(shí)戰(zhàn)應(yīng)用。

函數(shù)功能

formatDate 函數(shù)接受兩個(gè)參數(shù)，日期對象和格式參數(shù)，可以根據(jù)不同的格式參數(shù)將事件對象轉(zhuǎn)換成日期格式，大致使用如下

formatDate(new Date(), "yy-mm-dd")    // 18-05-13
formatDate(new Date(), "yyyy-MM-dd hh:mm") // "2018-05-13 16:35"

當(dāng)然也可以把函數(shù)掛載在prototype上面，這樣就只需要一個(gè)參數(shù)了，這個(gè)后續(xù)再說。

實(shí)現(xiàn)思路

實(shí)現(xiàn)思路比較簡單，就是利用，Date提供的函數(shù)，比如getMonth，getFullYear等函數(shù)先把Date對象拆解出必要的部分。年月日小時(shí)分鐘秒等，然后再根據(jù)傳入的參數(shù)進(jìn)行組合，得到想要的效果。這里有幾個(gè)處理過程中需要注意的地方。

對于1位的數(shù)字應(yīng)該可以支持選擇補(bǔ)0也可以不補(bǔ)0

formatDate(new Date(), "yyyy-M-dd") // "2018-5-13"
formatDate(new Date(), "yyyy-MM-dd") // "2018-05-13"

對于月份因?yàn)槭菑?開始計(jì)數(shù)的，所以要+1月，不是加1s啊

支持參數(shù)的各種組合

實(shí)現(xiàn)過程

因?yàn)樾枰С指鞣N組合，所以需要一個(gè)對象將個(gè)部分存儲下來，根據(jù)參數(shù)的格式能夠快速的解析出來對應(yīng)的值。對象的格式大致如下

var cfg = {
    yyyy: date.getFullYear(), // 年 : 4位
    yy: date.getFullYear().toString().substring(2), // 年 : 2位
    M: date.getMonth() + 1, // 月 : 如果1位的時(shí)候不補(bǔ)0
    MM: paddNum(date.getMonth() + 1), // 月 : 如果1位的時(shí)候補(bǔ)0
    d: date.getDate(), // 日 : 如果1位的時(shí)候不補(bǔ)0
    dd: paddNum(date.getDate()), // 日 : 如果1位的時(shí)候補(bǔ)0
    hh: paddNum(date.getHours()), // 時(shí)
    mm: paddNum(date.getMinutes()), // 分
    ss: paddNum(date.getSeconds()) // 秒
  }

雙位補(bǔ)0單位不補(bǔ)0，補(bǔ)0的過程封裝成一個(gè)函數(shù)paddNum，自然想到的是用正則表達(dá)式來判斷是否是1位，很容易寫出如下代碼

let paddNum = num => {
  if (/^d$/.test(num)) {
     return "0" + num
  }
  return num
}

不過還可以使用字符串提供的正則表達(dá)式replace功能簡化這個(gè)過程，使用捕獲組來獲取匹配的值，再+0，如果沒有匹配，就返回本身，這也正是我們想要的，這里提前需要把數(shù)字轉(zhuǎn)換成字符串。

let paddNum = num => num.toString().replace(/^(d)$/, "0$1")

這樣每個(gè)日期的數(shù)據(jù)處理部分就做完了。
下面實(shí)現(xiàn)日期格式的解析，要把傳入的日期格式做匹配，然后從對象解析出對應(yīng)的值，再拼到一塊。
分析傳入日期的格式，都是yyyy，dd這種重疊的格式，這就需要針對每一個(gè)匹配出來的值，都要匹配到與其相同的一組值，也就是如果匹配到y，那就要把緊跟在y后面所有的y都匹配出來，比如yy，yyyy等，直到遇到首個(gè)不是y的字符停止。這就需要在匹配環(huán)節(jié)記住匹配的部分并重復(fù)匹配，捕獲組又派上了用場。 /([a-z])(1)*/，1可以代替匹配到的字符，進(jìn)而組成新的匹配條件,這樣的匹配條件就是那種想要的重疊格式了。
所以解析的過程如下

format.replace(/([a-z])(1)*/ig, m => cfg[m])

整合

稍作整理，這個(gè)工具函數(shù)就組合起來了

const formatDate = (date=new Date(), format="yyyy-MM-dd hh:mm:ss") => {
  // 單位補(bǔ)0
  let paddNum = num => num.toString().replace(/^(d)$/, "0$1")
  // 指定格式字符
  var cfg = {
    yyyy: date.getFullYear(), // 年 : 4位
    yy: date.getFullYear().toString().substring(2), // 年 : 2位
    M: date.getMonth() + 1, // 月 : 如果1位的時(shí)候不補(bǔ)0
    MM: paddNum(date.getMonth() + 1), // 月 : 如果1位的時(shí)候補(bǔ)0
    d: date.getDate(), // 日 : 如果1位的時(shí)候不補(bǔ)0
    dd: paddNum(date.getDate()), // 日 : 如果1位的時(shí)候補(bǔ)0
    h: date.getHours(), // 時(shí)
    hh: paddNum(date.getHours()), // 時(shí)
    mm: paddNum(date.getMinutes()), // 分
    ss: paddNum(date.getSeconds()) // 秒
  }
  return format.replace(/([a-z])(1)*/ig, m => cfg[m])
}

可以看出用好正則表達(dá)式的捕獲組，可以大大簡化代碼量，邏輯看上去也很清楚。