ホームページ  >  記事  >  ウェブフロントエンド  >  JavaScript の Date について最も詳しく説明します。

JavaScript の Date について最も詳しく説明します。

黄舟
黄舟オリジナル
2017-03-07 15:01:08973ブラウズ

基本的な Date() については説明しません~ : )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]])

特定の月の日数を取得するにはどうすればよいですか?

この問題に遭遇した人はいるでしょうか?日付コンポーネントを作成したことがある場合は、この問題が発生するはずです。当時の私の解決策は次のとおりです。 🎜🎜次の 3 つのメソッドでは、月パラメータは JS 自体の日付の月定義に基づいており、0 です。は 1 月として使用されます🎜最も正直な方法🎜🎜
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"
🎜🎜🎜 2 月でうるう年の場合は、日数 +1 を使用します🎜🎜。自分で作成する OSX 用のカレンダー プラグイン http://www.php.cn/🎜🎜それでは、もっと良い方法はないでしょうか?手動マッピングや閏年判定のロジックがなければ良いのですが。 🎜

ちょっとした diao メソッド

🎜🎜
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"
🎜🎜🎜 私たちが知っているように、new Date() の 3 番目のパラメータは各月の最後のパラメータより大きくなる可能性があることがわかりました。例: 🎜🎜🎜
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;);
🎜🎜🎜 このように、この JS の特性を利用して、29 と 31 の 2 つのキーポイントを使用して、その月の末日を除いて同じ月であるかどうかを判断します + 1? (実際には28と30がキーポイントです)。 🎜

もう少し詳しい 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;);
🎜🎜🎜new Date() new Date() の 3 番目のパラメータが1 未満の値 (0 など) を取得しました。 もちろん、負の数値を渡すことは問題ありません: 🎜🎜🎜🎜

Date.prototype

🎜誰もが見られるように特定のドキュメントの説明をコピーするのは面倒なので、参考リンク: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Date🎜🎜ここで主に共有します。次の知識をお持ちください: 🎜

GMT (グリニッジ標準時) h3>🎜 グリニッジ標準時 (グリニッジ標準時またはグリニッジ標準時とも呼ばれ、旧訳グリニッジ標準時、英語: Greenwich Mean Time、GMT)本初子午線はそこを通過する経度によって定義されるため、イギリスのロンドン郊外にある王立グリニッジ天文台の標準時を指します。 🎜🎜1924 年 2 月 5 日以来、グリニッジ天文台は時刻調整情報を 1 時間ごとに世界に送信してきました。 🎜🎜理論的には、グリニッジ標準時の正午は、太陽がグリニッジ子午線を通過する時刻 (つまり、太陽がグリニッジ上空で最高点に達する時刻) を指します。地球の楕円軌道上の不均一な動きにより、この時間は実際の太陽時とは異なる場合があり、最大誤差は最大 16 分になります。 🎜🎜地球の毎日の自転はやや不規則で、ゆっくりと減速しているため、グリニッジ標準時は標準時として使用されなくなりました。現在の標準時は原子時計によって報告される協定世界時 (UTC) です。 🎜🎜したがって、MDN のドキュメントからも、toGMTString() の説明が次のようになっていることがわかります。 🎜
🎜 GMT (UT) タイム ゾーンに基づいて日付を表す文字列を返します。 toUTCString を使用します。 () 代わりに。🎜

UTC (協定世界時)

🎜協定世界時。協定世界時、または協定世界時とも呼ばれ、UTC と略されます (英語の「協定世界時」から /フランス語 " "Temps Universel Cordonné") は、最も重要な世界標準時間です。原子時と秒に基づいており、グリニッジ標準時に可能な限り近いものです🎜

CST (北京時間)

🎜北京時間、中国標準時、中国標準時。タイムゾーン区分に関しては、東部第 8 地区に属し、協定世界時より 8 時間進んでおり、UTC+8 として記録されます。 🎜🎜ただし、略語 CST の混乱を招くのは、CST が 4 つの異なる時刻を同時に表すことができることです: 🎜
  • 🎜 中央標準時 (USA) UT-6 :00🎜
  • 🎜中部標準時 (オーストラリア) UT+9:30🎜
  • 🎜中国標準時 UT+8:00🎜
  • 🎜キューバ標準時時刻 UT- 4:00🎜
🎜中国の JS クライアント時間とサーバー時間の不一致に関する問題を挿入します🎜🎜 要約すると、フロントエンドとバックエンドの送信時間には UTC を使用するようにしてください。時間。 🎜

ISO の日付と時刻の表現方法

🎜🎜rrreee🎜🎜🎜Polyfill を通じて、ISO がどのように時間を表現するかを知ることができます。最も重要な特徴は、最後の桁が「Z」であり、常に UTC 時刻であることです。 。 🎜

追加の追加

.valueOf() および .getTime()

🎜.valueOf() 関数および .getTime()同じです。 🎜🎜このメソッドは通常、コード内で明示的にではなく、JavaScript 内で呼び出されます。どのような意味です? <code>valueOf がないと、Date のインスタンスを操作できません。 🎜🎜🎜rrreee🎜🎜

.toJSON

🎜このAPIの名前を直接見ると、JSON形式の文字列を返すものかと思っていましたが、実際にはこんな感じです🎜🎜🎜rrreee🎜 🎜🎜実際にそうなったのです🎜🎜🎜rrreee🎜🎜🎜結果は解析できますか? 🎜🎜🎜rrreee🎜🎜🎜しかし、結果は単なる文字列です。この文字列を new Date() に渡す必要があります。 🎜

.toLocaleFormat()

🎜 はどの標準にも属しません。 JavaScript 1.6で実装されています。この API をサポートしているのは Firefox だけのようです。実際、正しいアプローチは .toLocaleDateString()🎜

.toLocale さまざまな String()

🎜.toLcale を使用することです。 String(locales [, options]])🎜

妈的这个 API 有点烦,看 MDN 的文档你就知道。这个 API 是用来本地化时间的。

这里稍微说下我对这些参数的理解:

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 までご連絡ください。