關於Date對象的前端面試題

寫在前面，總結面試題不一定是為了準備面試，更是對於自己的一種溫故知新，了解自己知識的熟練度和理解度。

以上問題可能還不夠全面，希望各位老司機在留言區留下你關於Date對象的面試題或容易被人忽略的知識點

問題一欄

1. Date的構造函數接受哪幾種形式的參數？
2. 如何優雅的輸出"今天星期幾"？
3. 如何將Date對象輸出為指定格式的字元串，如(new Date(), YYYY.MM.DD) => 2017.10.16
4. 如何計算並輸出兩個時間點的時間差？
5. 如何獲取幾天後的時間點對應的時間對象？

問題解答

1.Date的構造函數接受哪幾種形式的參數？

這道題看上去是一個「背書題」，貌似記住了書中的內容就可以答上此題，但是其實Date對象的構造函數的參數還是好幾種形式的，這點很容易讓人忽略。

Date對象的構造函數接受下面的幾種形式的參數：

包括默認參數——空、時間戳（距離1970年1月1日標準時間的毫秒長度）、和以具體時間點為組合的參數

new Date();nnew Date(value);nnew Date(dateString);nnew Date(year, month[, day[, hour[, minutes[, seconds[, milliseconds]]]]]);n

也就是說下面的代碼都可以實例化一個Date對象

var today = new Date();nvar today = new Date(1453094034000); // by timestamp(accurate to the millimeter)nvar birthday = new Date(December 17, 1995 03:24:00);nvar birthday = new Date(1995-12-17T03:24:00);nvar birthday = new Date(1995, 11, 17);nvar birthday = new Date(1995, 11, 17, 3, 24, 0);nnvar unixTimestamp = Date.now(); // in millisecondsn

需要注意的是在Safari和Chrome中，對於dateString的構造方式還是有些不同的，如下面這個時間字元串在Chrome中是可以解析的，而在Safari中將拋出異常。

new Date(2017-10-14 08:00:00)n//在Chrome中正常工作，而Safari中拋出異常Invalid Datennnew Date(2017/10/14 08:00:00);nnew Date(2017-10-14);n//上面這兩種構造方式都在兩個瀏覽器都是可以正常運行的，說明Chrome的檢查範圍更寬泛n

2.如何優雅的輸出「今天星期幾」？

這個題詳細對於Date對象稍加了解的人都能答上，但是想要將代碼寫的真正簡明扼要卻很考驗開發者的功力。

如果你要是回答利用Date對象實例的getDay()方法，然後再通過if或switch等流程式控制制語句來拼接字元串的話，那確實有點low了。

優雅的方式是：

今天星期+日一二三四五六.charAt(new Date().getDay())n

3.如何將Date對象輸出為指定格式的字元串，如(new Date(), YYYY.MM.DD) => 2017.10.16

這道題被問到的可能性還是很高的（阿里前端的面試就問了一次）

思路就是將預先想定的格式字元串通過replace方法替換成對應的時間片段，如將YYYY替換成Date.prototype.getFullYears()的輸出，當然每種形式還有不同的替換規則，但是思路大致相同。

下面是一個比較穩健的替換方式。

function formatDate(date, format) {n if (arguments.length < 2 && !date.getTime) {n format = date;n date = new Date();n }n typeof format != string && (format = YYYY年MM月DD日 hh時mm分ss秒);n var week = [Sunday, Monday, Tuesday, Wednesday, Thursday, Friday, Saturday, 日, 一, 二, 三, 四, 五, 六];n return format.replace(/YYYY|YY|MM|DD|hh|mm|ss|星期|周|www|week/g, function(a) {n switch (a) {n case "YYYY": return date.getFullYear();n case "YY": return (date.getFullYear()+"").slice(2);n case "MM": return (date.getMonth() + 1 < 10) ? "0"+ (date.getMonth() + 1) : date.getMonth() + 1;n case "DD": return (date.getDate() < 10) ? "0"+ date.getDate() : date.getDate();n case "hh": return (date.getHours() < 10) ? "0"+ date.getHours() : date.getHours();n case "mm": return (date.getMinutes() < 10) ? "0"+ date.getMinutes() : date.getMinutes();n case "ss": return (date.getSeconds() < 10) ? "0"+ date.getSeconds() : date.getSeconds();n case "星期": return "星期" + week[date.getDay() + 7];n case "周": return "周" + week[date.getDay() + 7];n case "week": return week[date.getDay()];n case "www": return week[date.getDay()].slice(0,3);n }n });n};n

4.如何計算兩個時間點的時間差

是這裡可以參考掘金的一篇文章js 計算兩個時間的時間差 - 掘金，這篇講的比較詳細，但是真正在面試的時候要說這麼細的話估計面試官也沒有耐心聽。

簡單的概括的話，就是先取得這兩個時間點的時間戳（距離1970年一月一日的標準日期的毫秒數），通過毫秒數和取余的方式來順序取得天數、小時數、分數。

5.如何獲取幾天後的時間點對應的時間對象？

這道題是不是太簡單了？~

這需要在當前時間戳上加上(天數×24×60×60×1000)這麼多毫秒數即可。

此外向大家推薦一個不錯的開源項目 ——MomentJS Moment.js | Home

上面幾道題都有封裝好的且設計優雅的方法，感興趣的可以去圍觀一下。