目錄
如何取得某個月的天數?
最老實的辦法
稍微diao 一點的辦法
再稍微diao 一點的方法
locales
options
老实的方法
diao 一点的方法
一些有用的时间库
首頁 web前端 js教程 關於JavaScript 的 Date 最詳細解讀

關於JavaScript 的 Date 最詳細解讀

Mar 07, 2017 pm 03:01 PM

基礎的 Date() 就不說了~ :  )

如何取得某個月的天數?

不知道大家有遇到這個問題嗎?我想如果你們寫過日期組件一定有這個問題,我當時的解決方案是這樣的:

以下的三個方法,month 參數我都根據JS 本身對於Date 的月份定義,採用0為1月

最老實的辦法

const EVERY_MONTH_DAYS = [31, 28, 31, 30, 31, 30, 31, 31, 30, 31, 30, 31];

function getDays(year, month) {
  if (month === 1 && isLeap(year)) return 29;
  return EVERY_MONTH_DAYS[month];
}
登入後複製

#手動做了每個月天數的映射,如果是2月份並閏年,那天數+1

隨便安麗一個自己寫的osx 上的行事曆外掛 http://www.php.cn/

那沒有更好的方法呢?手動 map 和閏年判斷的邏輯沒有就好了。

稍微diao 一點的辦法

function getDays(year, month) {
  if (month === 1) return new Date(year, month, 29).getMonth() === 1 ? 29 : 28;
  return new Date(year, month, 31).getMonth() === month ? 31 : 30;
}
登入後複製

#我們發現,new Date()的第三個參數是可以大於我們所知的每個月的最後一天的,例如:

new Date(2016, 0, 200) //Mon Jul 18 2016 00:00:00 GMT+0800 (CST)
登入後複製

這樣,我們就利用這個JS 的特性,用29和31這兩個關鍵點,去判斷除了那個月的最後一天+1還是那個月嗎? (其實28和30是關鍵點)。

再稍微diao 一點的方法

function getDays(year, month) {
  return new Date(year, month + 1, 0).getDate();
}
登入後複製

#new Date()的第三個參數傳小於1的數值會怎麼樣了,例如傳0,我們就獲得了上個月的最後一天,當然傳負數也沒問題:

new Date(2016, 0, -200) //Sun Jun 14 2015 00:00:00 GMT+0800 (CST)
登入後複製

##Date.prototype .各種String

具體的文件解釋懶得再複製一下給大家看,參考連結:https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Date

這裡主要和大家普及以下知識:

GMT(格林尼治平時)

格林尼治平時(又稱格林尼治平均時間或格林尼治標準時間,舊譯格林威治標準時間;英語:Greenwich Mean Time,GMT)是指位於英國倫敦郊區的皇家格林尼治天文台的標準時間,因為本初子午線被定義在通過那裡的經線。

自1924年2月5日開始,格林尼治天文台每隔一小時就會向全世界發放調時訊息。

理論上來說,格林尼治標準時間的正午是指當太陽橫穿格林尼治子午線時(也就是在格林尼治上空最高點時)的時間。由於地球在它的橢圓軌道裡的移動速度不均勻,這個時刻可能與實際的太陽時有誤差,最大誤差達16分鐘。

由於地球每天的自轉是有些不規則的,而且正在緩慢減速,因此格林尼治時間已經不再被用作標準時間。現在的標準時間,是由原子鐘報時的協調世界時(UTC)。

所以我們也從MDN 上的文檔看到對於

toGMTString()的解釋是:

Returns a string representing the Date based on the GMT ( UT) time zone. Use toUTCString() instead.

UTC(世界標準時間)

#協調世界時,又稱世界標準時間或世界協調時間,簡稱UTC(從英文「Coordinated Universal Time」/法文「Temps Universel Cordonné」而來),是最主要的世界時間標準,其以原子時秒長為基礎,在時刻上盡量接近於格林尼治平時

CST(北京時間)

北京時間,China Standard Time,中國標準時間。在時區劃分上,屬東八區,比協調世界時早8小時,記為UTC+8。

不過這個CST這個縮寫比較糾結的是它可以同時代表四個不同的時間:

  • Central Standard Time (USA) UT-6:00

  • Central Standard Time (Australia) UT+9:30

  • China Standard Time UT+8:00

  • #Cuba Standard Time UT-4:00

插一個中國地區JS 客戶端時間和服務端時間不一致的問題

總結就是,前後端去傳時間的時候,盡量都用UTC 時間。

ISO 日期和時間的表示方法

if ( !Date.prototype.toISOString ) {
  ( function() {

    function pad(number) {
      if ( number < 10 ) {
        return &#39;0&#39; + number;
      }
      return number;
    }

    Date.prototype.toISOString = function() {
      return this.getUTCFullYear() +
        &#39;-&#39; + pad( this.getUTCMonth() + 1 ) +
        &#39;-&#39; + pad( this.getUTCDate() ) +
        &#39;T&#39; + pad( this.getUTCHours() ) +
        &#39;:&#39; + pad( this.getUTCMinutes() ) +
        &#39;:&#39; + pad( this.getUTCSeconds() ) +
        &#39;.&#39; + (this.getUTCMilliseconds() / 1000).toFixed(3).slice(2, 5) +
        &#39;Z&#39;;
    };

  }() );
}
登入後複製

#透過Polyfill 我們就能知道ISO 是怎麼表示時間的,最主要的特徵是最後一位是“Z”,然後表示的總是UTC 時間。

額外的補充

.valueOf() 和.getTime()

.valueOf()的功能和.getTime() 一樣。

該方法通常在 JavaScript 內部被調用,而不是在程式碼中明確調用。什麼意思?沒有 

valueOf,那麼Date的實例是不能進行運算的。

var obj = Object.create(null);
obj + 1; // Uncaught TypeError: Cannot convert object to primitive value(…)
登入後複製

.toJSON

#直接看這個API 的名字的時候,我以為會回傳一個JSON 格式的字串,但其實是這麼一個東西

new Date().toJSON() // "2016-05-05T06:03:28.130Z"
登入後複製

其實是這麼回事

JSON.stringify(new Date()) // ""2016-05-05T06:06:02.615Z""
登入後複製

那結果能夠被parse 嗎?

JSON.parse(JSON.stringify(new Date())) // "2016-05-05T06:19:24.766Z"
JSON.parse(&#39;"&#39; + new Date().toJSON() + &#39;"&#39;) // "2016-05-05T06:19:24.766Z"
登入後複製

但是結果只是字串而已。需要再講這個字串交給 

new Date() 才行。

.toLocaleFormat()

不屬於任何標準。在JavaScript 1.6中被實作。似乎也只有Firefox 自持這個API,其實正確姿勢是用

.toLocaleDateString()

.toLocale各種String()

##.toLcale各種String (locales [, options]])

<p>妈的这个 API 有点烦,看 MDN 的文档你就知道。这个 API 是用来本地化时间的。</p><p>这里稍微说下我对这些参数的理解:</p><h4 id="code-locales-code"><code>locales

var date = new Date(Date.UTC(2012, 11, 20, 3, 0, 0));

// formats below assume the local time zone of the locale;
// America/Los_Angeles for the US

// US English uses month-day-year order
alert(date.toLocaleString("en-US"));
// → "12/19/2012, 7:00:00 PM"

// British English uses day-month-year order
alert(date.toLocaleString("en-GB"));
// → "20/12/2012 03:00:00"

// Korean uses year-month-day order
alert(date.toLocaleString("ko-KR"));
// → "2012. 12. 20. 오후 12:00:00"

// Arabic in most Arabic speaking countries uses real Arabic digits
alert(date.toLocaleString("ar-EG"));
// → "٢٠‏/١٢‏/٢٠١٢ ٥:٠٠:٠٠ ص"

// for Japanese, applications may want to use the Japanese calendar,
// where 2012 was the year 24 of the Heisei era
alert(date.toLocaleString("ja-JP-u-ca-japanese"));
// → "24/12/20 12:00:00"

// when requesting a language that may not be supported, such as
// Balinese, include a fallback language, in this case Indonesian
alert(date.toLocaleString(["ban", "id"]));
// → "20/12/2012 11.00.00"
登入後複製

locales所指的地区的时区和语言输出。

options

https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Global_Objects/Date/toLocaleString

  • localeMatcher 选择本地匹配的什么算法,似乎没什么大用

  • timeZone 再设置下 UTC 时区

  • hour12 是否12小时制

  • formatMatcher 各日期时间单元的格式化

    • weekday Possible values are "narrow", "short", "long".

    • era Possible values are "narrow", "short", "long".

    • year Possible values are "numeric", "2-digit".

    • month Possible values are "numeric", "2-digit", "narrow", "short", "long".

    • day Possible values are "numeric", "2-digit".

    • hour Possible values are "numeric", "2-digit".

    • minute Possible values are "numeric", "2-digit".

    • second Possible values are "numeric", "2-digit".

    • timeZoneName Possible values are "short", "long".

栗子:

var date = new Date(Date.UTC(2012, 11, 20, 3, 0, 0));

date.toLocaleString("en-US", {hour12: false}); // "12/19/2012, 19:00:00"

var options = {timeZoneName:&#39;long&#39;,weekday: "long", year: "2-digit", month: "narrow", day: "numeric"};
date.toLocaleString("en-US", options); // "Thursday, D 20, 12, China Standard Time"
登入後複製

插一个JavaScript 显示 Y-m-d H:i:s 的日期时间格式

老实的方法

let date = new Date();
let result = [
  [
    date.getFullYear(),
    date.getMonth() + 1,
    date.getDate()
  ].join(&#39;-&#39;),
  [
    date.getHours(),
    date.getMinutes(),
    date.getSeconds()
  ].join(&#39;:&#39;)
].join(&#39; &#39;).replace(/\b\d\b/g, &#39;0$&&#39;);
登入後複製

diao 一点的方法

var date = new Date();
var result = date.toLocaleString(&#39;zh-CN&#39;, { hour12: false })
  .replace(/\//g, &#39;-&#39;).replace(/\b\d\b/g, &#39;0$&&#39;);
登入後複製

一些有用的时间库

  • https://github.com/moment/moment

  • https://github.com/rmm5t/jquery-timeago

 以上就是关于JavaScript 的 Date 最详细解读的内容,更多相关内容请关注PHP中文网(www.php.cn)!



本網站聲明
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn

熱AI工具

Undresser.AI Undress

Undresser.AI Undress

人工智慧驅動的應用程序,用於創建逼真的裸體照片

AI Clothes Remover

AI Clothes Remover

用於從照片中去除衣服的線上人工智慧工具。

Undress AI Tool

Undress AI Tool

免費脫衣圖片

Clothoff.io

Clothoff.io

AI脫衣器

Video Face Swap

Video Face Swap

使用我們完全免費的人工智慧換臉工具,輕鬆在任何影片中換臉!

熱門文章

<🎜>:泡泡膠模擬器無窮大 - 如何獲取和使用皇家鑰匙
3 週前 By 尊渡假赌尊渡假赌尊渡假赌
北端:融合系統,解釋
3 週前 By 尊渡假赌尊渡假赌尊渡假赌

熱工具

記事本++7.3.1

記事本++7.3.1

好用且免費的程式碼編輯器

SublimeText3漢化版

SublimeText3漢化版

中文版,非常好用

禪工作室 13.0.1

禪工作室 13.0.1

強大的PHP整合開發環境

Dreamweaver CS6

Dreamweaver CS6

視覺化網頁開發工具

SublimeText3 Mac版

SublimeText3 Mac版

神級程式碼編輯軟體(SublimeText3)

熱門話題

Java教學
1664
14
CakePHP 教程
1423
52
Laravel 教程
1318
25
PHP教程
1269
29
C# 教程
1248
24
如何使用WebSocket和JavaScript實現線上語音辨識系統 如何使用WebSocket和JavaScript實現線上語音辨識系統 Dec 17, 2023 pm 02:54 PM

如何使用WebSocket和JavaScript實現線上語音辨識系統引言:隨著科技的不斷發展,語音辨識技術已成為了人工智慧領域的重要組成部分。而基於WebSocket和JavaScript實現的線上語音辨識系統,具備了低延遲、即時性和跨平台的特點,成為了廣泛應用的解決方案。本文將介紹如何使用WebSocket和JavaScript來實現線上語音辨識系

WebSocket與JavaScript:實現即時監控系統的關鍵技術 WebSocket與JavaScript:實現即時監控系統的關鍵技術 Dec 17, 2023 pm 05:30 PM

WebSocket與JavaScript:實現即時監控系統的關鍵技術引言:隨著互聯網技術的快速發展,即時監控系統在各個領域中得到了廣泛的應用。而實現即時監控的關鍵技術之一就是WebSocket與JavaScript的結合使用。本文將介紹WebSocket與JavaScript在即時監控系統中的應用,並給出程式碼範例,詳細解釋其實作原理。一、WebSocket技

如何利用JavaScript和WebSocket實現即時線上點餐系統 如何利用JavaScript和WebSocket實現即時線上點餐系統 Dec 17, 2023 pm 12:09 PM

如何利用JavaScript和WebSocket實現即時線上點餐系統介紹:隨著網路的普及和技術的進步,越來越多的餐廳開始提供線上點餐服務。為了實現即時線上點餐系統,我們可以利用JavaScript和WebSocket技術。 WebSocket是一種基於TCP協定的全雙工通訊協議,可實現客戶端與伺服器的即時雙向通訊。在即時線上點餐系統中,當使用者選擇菜餚並下訂單

如何使用WebSocket和JavaScript實現線上預約系統 如何使用WebSocket和JavaScript實現線上預約系統 Dec 17, 2023 am 09:39 AM

如何使用WebSocket和JavaScript實現線上預約系統在當今數位化的時代,越來越多的業務和服務都需要提供線上預約功能。而實現一個高效、即時的線上預約系統是至關重要的。本文將介紹如何使用WebSocket和JavaScript來實作一個線上預約系統,並提供具體的程式碼範例。一、什麼是WebSocketWebSocket是一種在單一TCP連線上進行全雙工

JavaScript與WebSocket:打造高效率的即時天氣預報系統 JavaScript與WebSocket:打造高效率的即時天氣預報系統 Dec 17, 2023 pm 05:13 PM

JavaScript和WebSocket:打造高效的即時天氣預報系統引言:如今,天氣預報的準確性對於日常生活以及決策制定具有重要意義。隨著技術的發展,我們可以透過即時獲取天氣數據來提供更準確可靠的天氣預報。在本文中,我們將學習如何使用JavaScript和WebSocket技術,來建立一個高效的即時天氣預報系統。本文將透過具體的程式碼範例來展示實現的過程。 We

簡易JavaScript教學:取得HTTP狀態碼的方法 簡易JavaScript教學:取得HTTP狀態碼的方法 Jan 05, 2024 pm 06:08 PM

JavaScript教學:如何取得HTTP狀態碼,需要具體程式碼範例前言:在Web開發中,經常會涉及到與伺服器進行資料互動的場景。在與伺服器進行通訊時,我們經常需要取得傳回的HTTP狀態碼來判斷操作是否成功,並根據不同的狀態碼來進行對應的處理。本篇文章將教你如何使用JavaScript來取得HTTP狀態碼,並提供一些實用的程式碼範例。使用XMLHttpRequest

javascript如何使用insertBefore javascript如何使用insertBefore Nov 24, 2023 am 11:56 AM

用法:在JavaScript中,insertBefore()方法用於在DOM樹中插入一個新的節點。這個方法需要兩個參數:要插入的新節點和參考節點(即新節點將要插入的位置的節點)。

JavaScript與WebSocket:打造高效率的即時影像處理系統 JavaScript與WebSocket:打造高效率的即時影像處理系統 Dec 17, 2023 am 08:41 AM

JavaScript是一種廣泛應用於Web開發的程式語言,而WebSocket則是一種用於即時通訊的網路協定。結合二者的強大功能,我們可以打造一個高效率的即時影像處理系統。本文將介紹如何利用JavaScript和WebSocket來實作這個系統,並提供具體的程式碼範例。首先,我們需要明確指出即時影像處理系統的需求和目標。假設我們有一個攝影機設備,可以擷取即時的影像數

See all articles