js將時間日期物件轉換為時間日期字元

admin發表於2017-03-19

雖然javascript有自帶的時間日期字串格式,但是並不能夠滿足我們的需求,因為過於固定,通常情況下我們需要自定義函式來滿足我們的要求,下面就分享一段這樣的程式碼例項,能夠實現比較靈活的時間日期物件轉換為字串的功能。

程式碼如下:

[JavaScript] 純文字檢視 複製程式碼
function formatNumber(number,fmt) 
{ 
  number=number+ ''; 
  if(fmt.length>number.length) 
  { 
    return fmt.substring(number.length)+number; 
  } 
  return number; 
} 
 
function formatDate(datetime,format) 
{ 
  var encn={ 
    MMM : ['一', '二', '三', '四', '五', '六', '七', '八', '九', '十', '十一', '十二'], 
    MMMM : ['1', '2', '3', '4', '5', '6', '7', '8', '9', '10', '11', '12'] 
  }, 
  values={ 
    y : datetime.getFullYear(), 
    M : datetime.getMonth(), 
    d : datetime.getDate(), 
    H : datetime.getHours(), 
    m : datetime.getMinutes(), 
    s : datetime.getSeconds(), 
    S : datetime.getMilliseconds() 
  }; 
  /*用正規表示式拆分日期格式各個元素*/
  var elems=format.match(/y+|M+|d+|H+|m+|s+|S+|[^yMdHmsS]/g); 
  //將日期元素替換為實際的值 
  for (var i=0;i<elems.length;i++) 
  { 
    if(encn[elems[i]]) 
    { 
      elems[i]=encn[elems[i]][values[elems[i].charAt(0)]]; 
     } 
    else if(values[elems[i].charAt(0)]) 
     { 
       elems[i]=formatNumber(values[elems[i].charAt(0)],elems[i].replace(/./g,'0')); 
    } 
  } 
  return elems.join(''); 
} 
var date=new Date(); 
var dateStr=formatDate(date,'yyyy年MMMM月dd日'); 
console.log(dateStr);

以上程式碼實現了我們的要求,可以對時間日期物件轉換為字串輸出,並可以自定義格式,上面的輸出格式只是其中的一種,當然還可以是其他形式,當然如果要靈活應用就需要理解程式碼,下面就介紹一下它的實現過程。

一.實現原理:

原理其實很簡單,就是使用正規表示式將時間日期格式字串生成陣列,然後然後將陣列相應的項替換換為對應的時間日期就可以了,核心就是如此,這裡不多介紹了,具體可以參閱程式碼註釋。

二.程式碼註釋:

1.function formatNumber(number,fmt){},此函式可以對日期數字進行格式化,比如月份8就會在前面加上0,使其成為08。第一個引數就是要進行格式化的數字,第二個相應的格式,這個格式比較簡單,就是一串0,具體的作用還要繼續往下面看。

2.number=number+ '',這個數字和一個空字串相加,其實就是將數字轉換為字串形式。

3.if(fmt.length>number.length){return fmt.substring(number.length)+number; },如果fmt的長度大於numer的長度,那麼就在number的前面加上指定位數的0,比如8可能會變成08。

4.return number,返回經過格式化後的數字。

5.function formatDate(datetime,format){},第一個引數是時間日期物件,第二個是要轉換的格式。

6.var encn={},這個物件直接量固定了月份是使用漢字還是阿拉伯數字,此程式碼中只有月份可以進行漢語和阿拉伯數字的轉換,當然也可以自行再定義其他的,這裡就不介紹了。

7.values={},此物件直接量,定義各個單位的事前日期。

8.var elems=format.match(/y+|M+|d+|H+|m+|s+|S+|[^yMdHmsS]/g),利用match函式,可以加個format字串分割為一個數字,例如"yyyy年MMMM月dd日"可以生成陣列["yyyy","年","MMMM","月","dd","日"]。

9.for (var i=0;i<elems.length;i++){},遍歷陣列中的元素。

10.if(encn[elems[ i]]),判斷是否是涉及月份的格式段。物件除了可以使用obj.x方式訪問屬性之外,可以使用obj["x"]這種方式。

11.elems[ i]=encn[elems[ i]][values[elems[ i].charAt(0)]],將陣列中對應索引的值替換為月份值。

12.else if(values[elems[ i].charAt(0)]) ,如果是其他涉及日期時間的格式段。

13.elems[ i]=formatNumber(values[elems[ i].charAt(0)],elems[ i].replace(/./g,'0')),同樣將對應的索引的日期時間格式段替換為相應的格式時間或者日期。

14.return elems.join(''),將陣列元素連線成字串,並返回。

三.相關閱讀:

1.substring()函式可以參閱javascript substring()一章節。

2.關於事件日期函式可以參閱JavaScript Date物件一章節。

3.match()函式可以參閱正規表示式match()函式一章節。 

4.charAt()函式可以參閱javascript charAt()一章節。 

5.replace()函式可以參閱正規表示式replace()一章節。

6.join()函式可以參閱javascript join()一章節。

相關文章