setTimeout は、指定された時間以降に指定されたコードを実行する JavaScript の API です。ブラウザでも Node.js でも広く使われているのですが、実装はまちまちで、色々と特殊な条件も多く、挙動を完璧に理解している人は少ないと思います。この記事では、そんな setTimeout を可能な限り深堀りしてみようと思います。

先に書いておきますが、ものすごくニッチで細かい話ばかり並びます。突然私が、ただ純粋に setTimeout について調べたくなったので、その結果をまとめただけのものです。普通に開発している人には必要のない情報が多くなるでしょう。この記事は基礎から setTimeout を学ぼう、という方には全然向かないと思います。

また、JavaScript のイベントループについてある程度理解していることを前提とします。その詳しい理解には、@PADAone さんの書かれた「イベントループとプロミスチェーンで学ぶJavaScriptの非同期処理」という本の中の「それぞれのイベントループ」を読んで頂けると良いかと思います。

JavaScript を書いたことがある人ならば一度は使うであろう console.log ですが、この関数は思ったよりも厄介な性質を持っています。その性質を知らずに console.log を使うと、デバッグ時に大ハマリしてしまうことがあります。この記事では console.log の落とし穴についてお話します。

今回は Chrome に特化して解説しますが、Firefox や Safari でも同じ落とし穴があります。

JavaScript で頻出する undefined と null について語ります。

とても有名な Wordle というゲームがあります。隠された 5 文字の英単語をヒントを手がかりに見つけるゲームなのですが、最大 6 回までしか入力が許されていないため、4 回目を超えたあたりから緊張感につつまれるよく出来たゲームです。

以前 YouTube で「Wordle ソルバーを30分弱で作ってみた【JavaScript実況プログラミング】」という動画を発表し、そこの冒頭でゲームの解説をしておりますので、ご存知のない方はご覧になって頂ければと思います。

さて、上記の動画で簡単なソルバーを作ったのですが、それは単純なアルゴリズムで生成されたソルバーであり、Hard モードを 6 回以内に確実に解くことは出来ません。そこで上記の録画の後、必ず 6 回以内で解けるソルバーを作成しました。この記事では、ハードモード対応の 6 回以内で確実に解けるソルバーをどのように作ったかについてご紹介します。

なおソルバーはこちらから遊べます。実際に触って楽しんでみてください。

先日、次のような JavaScript クイズを Twitter で出しました。

// JavaScript quiz: 出力は？
const a = [];
{
for(let i = 0; i < 10; i++) {
a[i] = () => console.log(i);
}
}
a[3]();
{
let i;
for(i = 0; i < 10; i++) {
a[i] = () => console.log(i);
}
}
a[3]();
{
for(let i = 0; i < 10;) {
a[i] = () => console.log(i);
i++;
}
}
a[3]();

— Takuo Kihira (@tkihira) August 15, 2022

答えは 3, 10, 4 なのですが、for 文の let 初期化専用の例外処理がない場合は 10, 10, 10 になるべき問題です。クロージャーをしっかり理解していれば（そして例外処理を知らなければ）、答えは全部 10 になるはずなのです。今回この記事では、なぜ 10 になるべきなのか、そしてなぜ 10 にならないのか、について解説します。