この動画は、JavaScriptの日付クラス（Date）がいかに奇妙で予測不可能な動作をするかを実際にテストしながら解説したものである。開発者がJavaScriptの日付処理でクイズに挑戦し、その過程で言語仕様の矛盾や理不尽な挙動に直面していく様子を記録している。V8エンジンとFirefoxでの違い、JavaのJDK 1.0から受け継がれた問題のある実装、そして時間処理の複雑さについても触れており、JavaScriptという言語の持つ根深い問題を浮き彫りにした内容となっている。
JavaScriptの呪われた本質
JavaScriptが呪われた言語だというのは、論争を呼ぶような発言ではないでしょう。素晴らしい言語である一方で、邪悪で恐ろしい側面もあります。世界を席巻するほど強力でありながら、たった一週間で設計されたという事実もあります。私はほぼすべての開発でJavaScriptを使っていて、大好きな言語です。
正確にはTypeScriptを使っているんですが、まあ同じようなものですね。それでも、JavaScript内部にある奇妙な動作がたくさんあることは認識しています。これまでもためらうことなく、そういった奇妙なJavaScriptの動作を解説する動画をたくさん作ってきました。でも、一つだけずっと話すのを躊躇していたことがあります。
日付処理という更なる呪い
JavaScript自体よりもさらに呪われているもの、それは日時処理、特にJavaScriptのdateクラスです。これは最も邪悪な組み合わせなんです。JavaScriptとその奇妙な動作、そしてタイムゾーンに内在するさらに奇妙な動作の組み合わせです。これは本当に楽しいものになりそうですね。
正直に言うと、実はこれはもう撮影済みなんです。今イントロを後から撮影しているところで、皆さんはこれから狂気への descent を見ることになります。私の苦痛のハイライトリールをお楽しみください。これから大恥をかくことになりそうです。
ということで、もうこれでいきましょう。いや、やっぱり直感を信じるべきでした。ああ、神様。
音楽が流れる中、私は叫びます。「死にそうです。本当に死にそうです。これで全部つじつまが合うんですね。」
「この予想が当たったのが気に入りません。狂いそうです。もしバカなことをすれば、正解できるんです。勉強になりました。何が起こってるんですか？この言語は何なんですか？なぜこんなものが存在するんですか？もう終わりにできませんか？お願いします、終わりにさせてください。狂いそうです。今回のセラピー代を誰かが払ってくれないと。」
スポンサー紹介
今日のスポンサーからの簡単なメッセージの後、私の苦痛を見ていただきます。
最近小さなプロジェクトをたくさん書いているんですが、それらをホストする適切な場所を見つけるのが少し面倒になってきました。完璧なデータベースプロバイダー、実際のサーバーのホスト、CDN、ファイアウォール、その他すべての部品を見つけるとなると、一つのアプリを動かすためだけに異なるクラウド間を飛び回ることになりがちです。
そして、プレビューやコードレビューのようなものが欲しければ、幸運を祈るしかありません。今日のスポンサーのSavalaを使わない限りは。彼らは良いデプロイメント体験に必要なすべてを理解しています。なぜなら、既にWordPress向けのKinstaとして構築済みだからです。WordPressには良い体験のためにこれらすべての要素が必要で、彼らは「ああ、これをすべてに提供できるな」と気づいたんです。
すべてと言うときは、本当にすべてを意味します。Rails、Next、Elixir、Laravel、何でも好きなものをホストできます。ほぼ確実にサポートしています。そして彼らを使うということは、怪しい小さなチームのクラウドを使うということではありません。GCPとCloudflareの上に構築していて、それぞれが最も得意とすることに使っています。これは私が実際に稼働させているデプロイメントです。
デフォルトでDOS protection がオンになっています。スイッチ一つでCDNキャッシュもオンにできます。文字通りダッシュボードに行ってチェックボックスにチェックを入れるだけです。そうすれば静的アセットをキャッシュするCDNとしてCloudflareが使えます。そう、本当にそれだけ簡単なんです。
データベースが必要な場合はどうでしょう？データベースタブをクリックして、データベース追加をクリックすれば、主要なデータベースから選択できます。これだけでも十分クールですが、さらに進むと、データベース管理のための完全なダッシュボードが得られることがわかります。これがこのデータベース内のすべてのデータです。すべてモックデータなので心配いりません。メールアドレスを漏らしたりはしていませんが、ここから直接SQLコマンドを実行できます。とても便利です。
ワンクリックでさまざまなものをデプロイできるテンプレートまで用意されています。特に面白いのは、WordPressの代替であるGhostが含まれていることです。ヘッドレスCMSの上に独自のフロントエンドを構築できます。クラウドのホッピングに疲れて、すべてが一箇所にまとまった場所が欲しい場合は、今すぐチェックしてください。無料で50ドルのクレジットがもらえます。詳しくは soyv.v.link/savala で今日学んでください。
JavaScriptのdateクラスクイズ開始
JavaScriptのdateクラスをどれくらい知っていますか？この挑戦でどれくらいうまくやれるか、嫌な予感がしています。
私はJavaScriptの奇妙な日時処理が得意ではないことで有名で、これから大恥をかくのではないかという嫌な予感がしています。
よし。いや。二つ。何？なんで？なぜゼロが2000として解釈されるんですか？よし。自分のリプルも同時に開けますか？ダブルゼロを試してみたいと思います。同じです。そして1は何？
ゼロは2011年ですが、1は20011年です。そして2は200121年です。何？これは深く私を傷つけることになりそうですね？そして数字。これで大きな苦痛を味わうことになりそうです。お願いです。
これまでに1つ正解しました。Unix epochなのは理にかなっています。これが動くとしたら全く理にかなりません。Date.parse。Date.parseは日付を返します。
そして日付同士は等しくなれないと思います。だからこれはfalseである必要があります。何？文字列でのみ動作します。だからゼロがゼロの文字列になります。冗談でしょう？
実際にdateに何かを投げるとエラーを投げるのかどうかわからないんです。動作がわからないんです。こんなことは絶対にしないでしょう。これは痛いことになりそうです。
これは文字通りランダムな推測のようなものです。無効な日付も日付オブジェクトです。nullやエラーではありません。素晴らしい。ああ神様。その上でget timeを実行するとどうなりますか？ああいや。ああいや。NANであることを願います。
これまでのところ2つ正解です。to stringはどうでしょう。何を返すでしょうか。そうするとエラーを投げます。チャットは私にバイブで行けと言っています。
心で感じます。嫌な予感がします。心の中で何かを感じることになりそうです。to time string。to ISOはエラーを投げました。これも同じことになるでしょうか？冗談でしょう？それは なぜ？なぜ？なぜto time stringは文字列 invalid date を返すのに、to iso stringはエラーを返すんですか？
よくわからない？2つのオプションを選んで、そうではないと信じる方を選んでください。
これまでで最高のアドバイスです。新しい日付1つ。少しカンニングしました。ごめんなさい。どうやってバイブコーディングでこれを推測したのかわかりません。ああ神様。ああ神様。数学のパターンに従うことを期待したいのですが、先ほど誰かが言った良いアドバイスは、2つを選んで最も可能性の低い方を使うということです。
だから1か2だと思います。そして私の推測では、パターンに従って2001年12月01日になるので、2だと思います。そうではなく、直感を信じるべきでした。ああ神様。
まあ、それはありえません。現実的ではありません。だから1か3である必要があります。死にそうです。本当に死にそうです。何？ただ知りたいんです。みんな、ごめんなさい。
なるほど、それは理にかなっています。いや、理にかなっていません。私は何？この言語が嫌いです。でも300にしたらどうでしょう？32の後でまた動き始めます。なぜ？何？13から31の数字の何が問題で、渡すことができないのに、それ以降はすべて可能なんですか？この言語は何なんですか？
さらに面白いことに、99を超えると。ああ、わかりました。
もっと面白いことに、49に達すると2049年になります。50は何らかのクソな理由で1950年に戻ります。ゼロが1970年だったことを覚えていても、50は1950年です。でも100に達すると、さらに昔に戻って今度は0100年になります。時間もランダムに変わります。誰かに指摘されるまで気づきませんでした。この言語は一体何なんですか？
さらなる混乱への道
次の質問です。
ここでは少しカンニングしました。これが0100年でこれが1999年だとわかっているからです。だからこれは正しいです。49が何だったか忘れました。クソ。それは2049年で、50が1950年でした。本当にひどくカンニングしました。ごめんなさい。ただ知りたかったんです。知らなければならなかったんです。
12.1。これが何になるのか文字通り全く見当がつきません。いや。何？これは12だけを渡したのと同じですか？12だけを渡したのと同じことをします。
1208。ああ、いや。ゼロにリセットされます。何？これで全部つじつまが合いますね。0.1がタイムスタンプ部分をゼロにリセットしました。0は何をするんでしょう？この予想が当たったのが気に入りません。狂いそうです。
どの月にもゼロ日はないので、無効とみなされます。ええ、素晴らしい。ありがとう、JavaScript。とても理にかなっています。
これについては考えたくもありません。何 負の このようなことをするとどうなりますか？invalidが唯一理にかなうものですが、ダッシュをこのタイプのダッシュとして扱うのでinvalidにはならないでしょう。最もバカなことは何かを考えているだけです。そして最もバカなものを選んで、正解でした。
だからこれからはそのようにやっていきます。おそらく1。文字列は日時型の文字列ではないので無視されるでしょう。月や曜日ではありません。だから単に無視されます。1を使います。そして前に確立したように、それは201101年です。クール。もしバカなことをすれば正解できます。勉強になりました。
空の文字列。空の。だからおそらくは月でも曜日でもないので、無効化されます。これはもう入力の一部ではないということです。つまり今は実質的に空の文字列です。空の文字列は実質的にゼロで、ゼロは実質的にエポック時間です。だから明らかに、無効なクソ日付です。
この言語は何なんですか？神様、これにはチャットを表示させるべきでした。チャットを見ないように最善を尽くしますが、皆さんが見られるようにここに置いておきたいと思います。
次の質問です。maybe 1。同じ理由でmaybeはランダムな文字列だからです。それは 待って、いや。May。Mayと書いてあります。ああ、彼はBSTにいます。それで騙されました。
なぜ4を入れたのかと思っていました。もう少し考えていれば正解できたのに。ずる賢い野郎です。ありがとう、Sam。2010年5月4日。fourthは認識しません。そんなに賢くはありません。だから2010年5月。あれをクリックしそうになりました。「よし、また後戻りするパターンをやるんだな」と思いました。
でも、ゼロ番目のようなものがないから、そうではないかもしれません。May four UTC。4を何に使うんでしょう？何も論理的なことには使わないでしょう。UTCは確実に無視するでしょう。これらの中で文字通り全く意味をなさないのは、これです。だからこれをクリックします。
ああ、実際にUTC部分を使いました。クール。知っておいて良かったです。ほとんど意味をなす答えを出したのはこれが初めてです。UTC plus 1。正しく解析されないでしょう。いや、されます。クール。本当に信頼を失いました。
ああ神様、ここで何をするつもりでしょう？この時点で、もうわからないんです。2201年。それで正しい量だけオフセットしました。
UTCにランダムなオフセットをしても、それを処理します。これを正しく2に変換するでしょうか？これで正しくできることは何もありませんが。死にたいです。無効であってください。いや。何？それは60を1960年として解析します。なぜなら、それをタイムスタンプのオフセットとして解析できないからです。完璧にクソ理にかなっています。なんて正気な言語でしょう。
ああいや。ここにあるすべての情報を使うものを見つけたいです。これらには1990年部分と2010年部分の両方がありません。ここには満足できる答えがありません。よし、ついに。ああ神様。2010年を括弧で囲むと、無効になることを本当に期待していたんですが、括弧内のテキストは無視されます。
それは常にそうなんですか？そうです。クール。括弧がどこにあっても関係なく、無視されます。
新しい日付、負の空の配列。負の空の配列は何にマップされるんでしょう？自分にヒントを与えています。それは負のゼロです。負のゼロはゼロです。1970年。よし、クール。うーん！ほぼ半分です。ほぼ50%取れました。この言語が嫌いです。本当に嫌いです。
そしてそれはカンニングありでのことです。ええ。ああ神様。何？この言語は何なんですか？なぜ私たちは自分自身にこんなことをするんでしょう？
将来への希望
Temporal APIがとても楽しみです。Zoned date timeは仕様を持つオブジェクトを受け取ります。なんて素晴らしいんでしょう。うるう年での年。to string。ああ、このAPIがとても欲しいです。これはとても助けになるでしょう。
私はまだdayjsの人ですが、date-fnsも本当に良いです。new dateよりもずっと良い選択肢がたくさんあります。期待したことを決してしません。死にたいです。
この絶対的な怪物をまとめて私の頭を痛くさせてくれたSamに感謝します。彼は素晴らしい記事をたくさん書いていて、その多くを皆さんもここで見たことがあるでしょう。私が絶対に大好きなロードバランシングの記事も含めてです。
彼はブラウザでの呪われたものの専門家で、明らかにJavaScriptの日時カオスで新しいレベルの呪いを見つけました。死にたいです。これが私を傷つけた以上に皆さんの助けになることを願います。まだ見ていない方は、私のWTFJSの動画をご覧ください。言語内の同様の恐ろしくカオスなもののセットを解説しています。本当にたくさんあるんです。
ああ神様、私たちは呪われた言語で働いています。これほど呪われている理由は、誰かがその呪われた動作に依存しているため、何も変更できないからです。いつものように、これにはXKCDがあります。バージョン1017での変更。スペースバーを押し続けてもCPUがオーバーヒートしなくなりました。長年のユーザー4。このアップデートで私のワークフローが壊れました。
コントロールキーに手が届きにくいので、代わりにスペースバーを押し続けています。そして急激な温度上昇をコントロールとして解釈するようにEmacsを設定しました。それは恐ろしいことです。見てください、私のセットアップは私には有効です。スペースバー加熱を再有効化するオプションを追加してください。
今、現在の動作方法でこれらすべてのことを行うウェブサイトがあると想像してください。どんなにカオスでも。そして、その人がもうサイトを維持していないとします。新しい仕事を得て、バスファクターが作用し、何か他のことが起こって、もう維持できなくなりました。そしてブラウザがこの動作を修正しに行きます。私たちは困ります。
そして、この時点で、それを修正することに十分な利益はありません。ブラウザでさらに厳しくなるような別のストリクトモードタイプのことができるでしょう。それは起こりません。誰もそれに賛同しないでしょう。今持っているものに対処するだけです。ブラウザが動作する方法は、ブラウザが動作する方法であり、それを回避するのが開発者としての私たちの仕事です。
そして、すべてのフレームワークとツールから離れてバニラJSに戻るべきだと言っている人たちに対しては、日時を扱わないことを願います。
音楽
日付がどれほど呪われているかについて話すのが終わったと思い続けています。SamがbunがV8をコピーすると言っていたのを見ました。明らかにそうです。ChromeやNodeなどすべてにあるV8エンジンが最も標準的です。文字通りではありませんが、公式のJS標準を本当によく表しています。でも、他のエンジンもそれを持っていると思っていたのに、必ずしもそうではないようです。
Firefoxは非常に異なる動作をします。良かれ悪しかれ、私は実際に今Firefox ベースのブラウザにいます。だからランダムなサイトに行きます。コンソールを開きます。new date zero。クール。動きます。1 2 3 4 5 13が壊れます。これまでと同じ動作です。
Sam、ここで困惑しています。Firefoxでは何が違うんですか？どうやらV8はdateすら実装していません。ランタイムによって提供されています。
だから、Node、Chromium、Dinoなどすべてが日付の動作方法を提供しています。それはさらに呪われています。ああ神様、これについてあまりにも多くを学んでいます。これは楽しいです。これらのもののいくつかについて、異なるブラウザが異なる動作をします。だから12ポイントの例は、負のものと同様に、NodeやChromeでは有効でもここでは無効です。それは楽しいです。
maybe oneの例もFirefoxでは壊れています。FirefoxがこれらのバッドプラクティスUsersから私たちを守ってくれるので壊れてくれることに、今まで一度も感謝したことがありませんでした。どうやらFourth of Mayの例もFirefoxでは無効です。ここでやってみたいことがあります。UTC。それでその部分は修正されます。
でもFirefoxでは何をしても動きません。それは少し厄介です。他の例とは異なり、これは使い道があると思えます。そして、どうやらオフセットもFirefoxではサポートされていません。少なくとも非整数のものは。待って、もしかするとどれもサポートされていないかもしれません。私が間違っていて、Firefoxが単に呪われているだけかもしれません。
どうやらSamは職場で日付のバグに取り組んでいるときに奇妙さに気づいて、掘り続けて、狂い続けたためにこれをすべて行ったそうです。そのようなことが大好きです。昨日面白いYouTube動画を見ていました。とても脱線してしまいました。構いません。これは素晴らしかったです。
さらなる混乱の発見
Spindaの rabbit hole はあなたが思っているより深いです。ポケモンにはSpindaというポケモンがいて、ランダムに配置される4つのスポットがあります。そしてそれらのスポットが異なるゲームやIPで配置される異なる方法は、本当に面白いです。そして進むにつれてどんどん奇妙で奇妙になっていきます。とても楽しいです。そしてこれは私にそれを思い出させます。
違いは、それはビデオゲームで役に立たない単一のポケモンだということです。そしてこれはブラウザで最も重要な標準の一つです。Firefoxのnew dateでこのような文字列ができないのは少し狂っています。実際にTwitchの内部ツールで私たちが持っていた一人のFirefoxユーザーでこれに遭遇したので、実際に知っていたと思います。
でも、これを違った方法でやったらどうでしょう。今好奇心があるので。それでもUTC + 1をやります。オフセットも処理します。だからこの部分は正常に処理します。May 4th部分ができないんです。先頭にランダムなテキストを追加したらどうでしょう。気にしません。
これはとても呪われています。これすべてが嫌いです。神様、狂いそうです。
これがとても呪われていると思っているのは私だけではないことが嬉しいです。一週間でJavaScriptを作成した伝説のBrendan Eikeが、ここでのSamの仕事にコメントしています。ちなみに、まだフォローしていなければTwitterで彼をフォローしてください。Brendan Eikeのコメントは「JDK 1.0のコードをJS 1.0にコピーしてはいけないという大きな教訓を広めてくれてありがとう」でした。
どうやら、実装の大部分は昔のJava util dateからのものでした。そしてJavaのそのモジュールは、より現代的なAPIを持つcalendarという新しいモジュールに置き換えて廃止されました。でもJavaScriptはJavaの本当に悪い実装、文字通りJDK 1.0をコピーしたので、私たちは今その呪われた性質に苦しまなければなりません。なぜなら、Javaのような言語は新しいメジャーバージョンが出たときに改善を行うことができるからです。
そしてJavaScriptのような言語は、古いウェブサイトで動作し続けなければならないため、できません。ああ、死にたいです。これは恐ろしいです。すべてが嫌いです。
Tom Scottの時間についての考察
プログラミングで時間とタイムゾーンがどれほど困難かについてのさらに面白いランティングが欲しければ、これはTom Scottの最初の動画の一つです。記憶では、これは彼の初めてのバイラル動画だと思います。この動画について頻繁に考えます。まだ見ていなければチェックしてください。日時管理のカオスについての面白い深掘りです。
「そしてロシアの歴史家から電話がかかってきて、『ええ、私たちは20世紀にグレゴリオ暦に変更しただけです』と言われます。そして、あなたがスキップする日付は場所によって変わることがわかります。それにも対処できますか？
そしてイギリスの歴史家から電話がかかってきて、16世紀まで、年は3月25日に始まっていたと言われます。あなたの心を吹き飛ばすためだけに。」
そう、日時は邪悪です。そして、日時のように邪悪なものをJavaScriptのように邪悪なものと組み合わせると、結果は本当に、本当に、本当に痛いものになります。皆さんが今見たように。
皆さんが私の苦痛を楽しんでくれたことを願います。私は確実に楽しめませんでした。私の一日を台無しにしてくれたSam、ありがとう。次回まで。Peace、nerds。
続く混乱
止められませんでした。自分をコントロールできないんです。May 4thが受け入れられないことについて、とても混乱しています。May 4は認識されません。でも2021をつけると、だめです。でも2021-5のようなダッシュを追加すると、突然May部分を認識します。04はどうでしょう？何？だからMay 4th、May 04は動きません。でもmayo 4 col04は動きます。13 col 74はどうでしょう？動きます。
20や30にすると、なぜ？なぜ？これは全く意味をなしません。文字通り狂いそうです。何が起こっているんですか？この言語は何なんですか？なぜこんなものが存在するんですか？もう終わりにできませんか？お願いします、もう終わりにさせてください。狂いそうです。
コメント