VIDEO LESSON

JavaScriptのDate.now()の使い方：引数・戻り値・実例と注意点の解説動画

再生時間 7:46動画を別のタブで開く ↗

動画の字幕・文字起こしを読む

再生中の字幕を濃い黒で表示し、一番上に追従します。字幕の行を選ぶと、その位置から再生できます。

0:00こんにちは。
0:00今回はジャバスクリプトのデート・ナウを紹介します。
0:05これは、今の時刻を数値で受け取るための静的メソッドです。
0:09戻り値は、千九百七十年一月一日、協定世界時の午前零時から数えた経過ミリ秒です。
0:16日時の見た目ではなく、ただの大きな数値が返る点が特徴です。
0:20そのため、更新時刻を記録したり、二つの時刻の差を計算したりする場面に向いています。
0:27この動画では、引数と戻り値、記事の基本例、エポックからの数え方、そして精密な測定に向かない理由まで、
0:32実行結果と一緒に学びます。
0:37時刻を数値として扱う考え方を最初に押さえておくと、後の例がすべて理解しやすくなります。
0:45まず動作環境を確認します。
0:46このメソッドはとても古くからある機能で、クロームではバージョン一以降、ファイアーフォックスでは一以降、
0:51サファリでは四以降、エッジでは十二以降で使えます。
0:56ノード・ジェイエスでも、ゼロ・一ゼロ・ゼロ以降で対応しています。
1:00記事の互換性情報は、エムディーエヌのデータに基づく目安で、すべての環境で実機検証したという意味ではありません。
1:06追加のパッケージやインポートは必要なく、デートという名前からそのまま呼び出せます。
1:11ブラウザーのコンソールでも、ノードでファイルを実行しても、同じコードで試せるので、
1:16学習環境を選ばない点も初心者にはありがたいところです。
1:20引数と戻り値を確認します。
1:22書き方は、デートのあとにドットを書き、ナウとカッコを続けます。
1:27これは静的メソッドなので、ニューでデートオブジェクトを作る必要はありません。
1:33引数はありません。
1:35カッコの中に何か渡すのではなく、呼んだ瞬間の時刻が自動で返ります。
1:40戻り値は数値型で、小数点のない整数です。
1:44呼ぶたびに値が増えていくため、二回続けて呼んでも通常は同じ値にはなりません。
1:50対象の作り方、引数がないこと、戻り値が整数の数値であること、この三点を押さえれば使い方はほぼ理解できます。
1:59戻り値の数え方を読み解きます。
2:01起点は千九百七十年一月一日、協定世界時の午前零時で、この瞬間をゼロとします。
2:07そこから千ミリ秒進むごとに値が千ずつ増え、一秒で千、二秒で二千となります。
2:13実際に、ゼロをデートに変換すると起点そのものの日時になり、千を変換すると一秒後の日時になることを実機で確認済みです。
2:23単位は秒ではなくミリ秒です。
2:25ここを取り違えると、計算結果が千倍ずれてしまいます。
2:29今の時刻の値は、十桁をはるかに超える大きな整数になりますが、怖がる必要はありません。
2:36起点からの経過時間だと理解すれば、差を取る計算にもそのまま使えます。
2:42記事の基本例を見ます。
2:43まず、デート・ナウを呼んで、結果をタイムスタンプという変数に保存します。
2:49次に、その値が有限の数かどうかと、整数かどうかを確認します。
2:53実行結果はどちらもトゥルーで、記事の期待出力とノードの実機結果が一致しています。
2:59実行のたびに値そのものは変わるので、記事では具体的な数値ではなく、値の性質を確認する形になっています。
3:07ファイルに保存してノードで実行しても、ブラウザーのコンソールに貼っても同じ結果です。
3:13再宣言エラーが出たら、ページを再読み込みするか、コード全体をブロックで囲んでください。
3:20まず性質を確かめる、という進め方は、値が毎回変わるメソッドを学ぶときのよい型です。
3:26記事の境界条件の例で、単位をもう一度確かめます。
3:30千という数値をデートに変換して、アイエスオー文字列で表示すると、結果は千九百七十年一月一日、
3:36午前零時零分一秒になります。
3:41千ミリ秒イコール一秒、という関係が目で見て分かります。
3:46この出力も実機で確認済みです。
3:48もし単位を秒と勘違いして千秒として扱えば、十六分四十秒ずれてしまいます。
3:55タイマーや有効期限の計算では、この千倍のずれがそのままバグになります。
4:01数値を見たら、まず単位はミリ秒だと声に出して確認するくらいで、ちょうどよい慎重さです。
4:08小さな確認例ほど、実務の事故を防いでくれます。
4:12実用例として、処理にかかった時間を測ります。
4:16やり方はシンプルで、処理の直前にデート・ナウを呼んで開始時刻を記録し、処理の直後にもう一度呼んで終了時刻を記録します。
4:25終了から開始を引けば、経過したミリ秒が得られます。
4:29スライドの例では、百万回の足し算にかかった時間を測っており、実機では二十四ミリ秒という結果でした。
4:36ただし、この数値はパソコンの性能や負荷で毎回変わるため、答え合わせの対象ではありません。
4:43大切なのは、差を取るという考え方です。
4:46重い処理の前後に挟むだけで、どこが遅いかの当たりを付けられるようになります。
4:52もう一つの実用例として、更新時刻の記録を見ます。
4:56メモなどのデータを保存するとき、その瞬間のデート・ナウの結果を、更新時刻として一緒に持たせます。
5:03数値で持つ利点は、並べ替えと比較がしやすいことです。
5:08新しい順に並べるなら数値の大きい順、一定時間過ぎたかを調べるなら差の計算、
5:11どちらも簡単です。
5:15画面に表示するときだけ、デートに変換して人間向けの形に直してください。
5:21保存は数値、表示は日時、と役割を分けるのがコツです。
5:25前の動画で学んだトゥーアイエスオーストリングと組み合わせると、記録から表示までの流れが一通り作れるようになります。
5:34最も間違えやすい注意点です。
5:37デート・ナウの単位はミリ秒ですが、世の中には秒単位で時刻を表す仕組みも多くあります。
5:44サーバーから秒単位の値を受け取って、そのままミリ秒としてデートに渡すと、
5:49千九百七十年付近の日時に戻ってしまいます。
5:54逆に、ミリ秒の値を秒として渡すと、はるか未来の日時になります。
5:59桁数も手がかりです。
6:01今のミリ秒の値は十三桁前後、秒の値は十桁前後になります。
6:06外部との受け渡しでは、変数名に単位を含める、受け取ったら桁数を確認する、
6:10といった工夫が有効です。
6:14単位の確認は、地味ですが時刻まわりのバグを防ぐ一番確実な方法です。
6:20もう二つ注意点があります。
6:22一つ目は精度です。
6:23デート・ナウが読むのは端末のシステム時刻で、時刻の自動補正などで前後することがあります。
6:29そのため、細かい経過時間を精密に測る用途には向かず、記事でもパフォーマンス・ナウなどの検討が案内されています。
6:37二つ目は呼び出し方です。
6:38ナウはデート自体から呼ぶ静的メソッドで、作ったデートオブジェクトから呼ぶものではありません。
6:45実機でも、オブジェクト側にはナウが存在しないことを確認済みです。
6:49壁時計としての今がほしいときはデート・ナウ、止まらない物差しで経過を測りたいときは別の方法、
6:53と使い分けてください。
6:57まとめです。
6:58デート・ナウは、今の時刻を、千九百七十年一月一日からの経過ミリ秒という数値で返すシンプルな静的メソッドです。
7:08導入時の判断は三つです。
7:10まず、引数はなく、戻り値は整数の数値だと押さえること。
7:14次に、更新時刻の記録や並べ替え、差の計算に向き、画面表示には変換が必要だと理解すること。
7:22そして、システム時刻の補正の影響を受けるため、精密な経過時間の測定では別の方法を検討することです。
7:31まずはコンソールで何度か呼び、値が増えていく様子と桁数を確かめてみてください。
7:38お疲れさまでした。
7:39慣れてきたら、自分の処理の前後に挟んで時間を測るところから始めてみてください。

日本語字幕をダウンロード（WebVTT）

この動画で学べること

Date.now()で現在時刻をUnixエポックからのミリ秒で取得する方法を解説。引数と戻り値、実行結果付きのコード、間違えやすい点、ブラウザー・Node.js対応を確認できます。

解説記事・サンプルコードを読む：JavaScriptのDate.now()の使い方：引数・戻り値・実例と注意点 →