DanLevy.net

クイズ：JavaScript Date 14問

JSトリビアでパーティーを盛り上げよう！✨

Hero image for クイズ：JavaScript Date 14問

Dateクラスについてどれだけ知っていますか？

  • JavaScriptのスキルを証明せよ！ 🚀
  • ログインやサインアップは不要。 ✨
  • 選択問題。 🤖 …… どれほど難しいっていうの？

概要

JavaScriptのDateクラスは、悪名高いほど扱いづらいAPIを持つ。これはJavaから継承されたもので、たぶん古代新石器時代の時間計測方法に触発されたとしか思えない。

Dateを扱う苦労から、多くの開発者は何の疑問も持たずにサードパーティライブラリを使うようになる。多くの場合それは安全で信頼できる選択だが、日付のフォーマットやローカライゼーションにこれらのライブラリが必要になることはほとんどない。

このクイズは、ネイティブのDate APIに関する知識を試し、深めるために作られている。ヒントや解説が必要なときは緑色のボタンを使おう！このチャレンジを終える頃には、JavaScriptのDateに対する理解が確かなものになっているはずだ。

注: すべての例はGMT-7のローカルタイムゾーンを想定しています。

👇 以下の14問 👇

1. 

日付の扱い

この Date が表すローカルの日付はどれですか？（コンソールの表示形式は環境により異なります。）

const d1 = new Date(2020, 1, 1)
console.log(d1)

月の引数は0から始まります。西暦では0〜11の範囲です。

‘2月’ のインデックス値は1です（配列のルックアップと考えてください）。

2. 

日付の扱い

この Date が表すローカルの日付はどれですか？（コンソールの表示形式は環境により異なります。）

const d2 = new Date(2020, 0, 1)
console.log(d2)

月の引数はゼロベースです。範囲は0〜11（西暦を使用）。

‘January’ のインデックス値は0です。（配列のルックアップのように考えてください。）

3. 

日付の操作

出力には何が含まれますか？

const d3 = Date('Thu, 01 Jan 1970 00:00:00 GMT')
console.log(d3)

Date(...) は new なしでも呼び出せます。この場合、引数はすべて無視され、現在のローカル日時を表す文字列が返されます。Date オブジェクトを作る new Date(...) とは戻り値も引数の扱いも異なります。

4. 

日付の取り扱い

ローカルタイムゾーンは、その日時に GMT−07:00 とします。 出力に含まれるのはどれですか？

  const date = new Date(2020)
  console.log(date.getFullYear())

単一の整数引数で作成されたDateインスタンスは、UnixのEpoch値として解釈されます。Epochは1970年1月1日からの経過ミリ秒です。

2020ミリ秒の値は、1970年1月1日から2秒後を意味します。

そして、ローカルタイムゾーンが-7時間のオフセットであるため、Wed Dec 31 1969 17:00:02 GMT-0700 (Mountain Standard Time)となります。

ローカルタイムゾーンのオフセットを回避するには、.getUTCFullYear()を使用します。

5. 

日付の扱い

ローカルタイムゾーンは、その日時に GMT−07:00 とします。 コンソールに出力される値は？

  const d1 = new Date('2020-01-01')
  const d2 = new Date('2020-01-01T00:00')
  console.log(d1.getFullYear(), d2.getFullYear())

T 時刻値のない文字列は一見 2020年1月1日のように見えますが、日付のみの文字列はUTCとして解釈され、現地のタイムゾーン（GMT-7）に調整すると2019年のままであることがわかります。

タイムゾーンが明示されていない日時文字列は現地時間として解釈されます。

T00:00 形式の場合、2番目の値は現地の真夜中として解釈されます。

1番目の日付は Tue Dec 31 2019 17:00:00 GMT-0700 (Mountain Standard Time) として解釈されます。 2番目の日付は Wed Jan 01 2020 00:00:00 GMT-0700 (Mountain Standard Time) として解釈されます。

6. 

日付の扱い

_誤った_書式設定メソッドを選択してください:

toLocaleFormat() はECMAScript標準の一部ではありません。移植性のあるコードには、標準の toLocaleDateString() や toLocaleString() を使います。

toLocaleDateString ドキュメント メソッドをチェックしてみてください。その動作は Intl.DateTimeFormat に文書化されています。

7. 

日付の処理

出力には何が含まれますか？

  var date = Date.UTC('2020-01-02T00:00')
  console.log(date.toUTCString())

Date.UTC() は Date オブジェクトではなく数値を返します。この呼び出しでは日時文字列が年の数値に変換できないため NaN になります。その数値に toUTCString() メソッドはないので、呼び出すと TypeError が発生します。

8. 

日付の扱い

出力には何が含まれますか？

  const d = Date.UTC(2020, 0, 1)
  console.log(d)

ヘルパーメソッド Date.UTC は日付インスタンスを返しません。ミリ秒単位の整数を返します。

9. 

日付の扱い方

ローカルタイムゾーンは、その日時に GMT−07:00 とします。 出力には何が含まれますか？

  // Assume local TZ is -07:00
  const d = new Date(Date.UTC(2020, 0, 1))
  console.log(d.getTimezoneOffset())

getTimezoneOffset() は、その日時のUTCとローカル時刻の差を分で返します。GMT−07:00 の場合は 420 です。Date オブジェクトはタイムゾーン名を保持せず、エポックからの経過ミリ秒を保持します。オフセットはホストのタイムゾーンと対象日時に依存し、夏時間のある地域では季節によって変わります。

10. 

日付の扱い

この Date が表すローカルの日付はどれですか？（コンソールの表示形式は環境により異なります。）

  const d = new Date(2020, 0, 1)
  d.setDate(1)
  console.log(d)

.setDate() メソッドは、指定されたインスタンスの現在の月に基づいて、日（日付）を設定します。

値が月の日数範囲外の場合、日付インスタンスの月が調整されます（例: 1月に setDate(32) を実行すると、2月1日として計算されます）。

11. 

日付の操作

この Date が表すローカルの日付はどれですか？（コンソールの表示形式は環境により異なります。）

  const d = new Date(2020, 0, 1)
  d.setMonth(1)
  console.log(d)

.setMonth()メソッドは、指定された日付インスタンスの月を設定します。

月の引数は0から始まり、範囲は0-11です（西洋のカレンダーを使用）。

12. 

日付の取り扱い

この Date が表すローカルの日付はどれですか？（コンソールの表示形式は環境により異なります。）

  const d = new Date(2020, 0, 1)
  d.setMonth(12)
  console.log(d)

.setMonth()メソッドは、指定された日付インスタンスの月を設定します。

month引数は0から始まり、西暦のカレンダーでは0〜11の範囲の12の値があります。

ここでは、setMonth(12)が11（12月）よりも1多いため、年が2021に調整されていることがわかります。

13. 

日付の取り扱い

この Date が表すローカルの日付はどれですか？（コンソールの表示形式は環境により異なります。）

  const d = new Date(2020, 0, 1)
  d.setMonth(13)
  console.log(d)

.setMonth() はローカル日時の月を、0から始まる番号で設定します。0が1月、11が12月です。

setMonth(13) は翌年の2月を意味するため、この例では2021年2月1日になります。0〜11の範囲外の値も受け付け、年を繰り上げたり繰り下げたりします。

14. 

日付の扱い

この Date が表すローカルの日付はどれですか？（コンソールの表示形式は環境により異なります。）

  const d = new Date(2020, 0, 1)
  d.setMonth(-1)
  console.log(d)

.setMonth() メソッドは、指定された日付インスタンスの月を設定します。

月の引数は0から始まり、0〜11の範囲です（西洋の暦を使用）。

ここでは、月と年が2019年12月に戻っています。これは、setMonth(-1) が0（1月）より小さいためです。

Loading comments...