とある休日の朝
娘（4歳）「パパ、最近はお仕事でどんなWebサイトを作ってるの？」
ワイ「ん？詳しくは言えへんけど、技術記事投稿サイトや」
娘「Qiitaのパクリみたいなやつ？」
ワイ「ハッキリ言うなや」
娘ちゃんはなぞなぞがしたい
娘「それよりパパ、なぞなぞしよ」
ワイ「ええで」
娘「じゃあ行くよー」
娘「実行時エラーの出ないフロントエンド言語ってなーんだ？」
ワイ「いやどんななぞなぞやねん」
ワイ「っていうか、どんな言語でも実行時エラーは出るやろ」
ワイ「例えばさっきの技術投稿サイトで」
ワイ「最新記事を1件表示しようとした場合...」
const newestArticle = articles[0];
ワイ「↑こんな感じで最新の1件を取得して」
<div>
<h2>最新記事</h2>
<span>{ newestArticle.title }</span>
</div>
ワイ「↑こんな感じで画面に表示しようとするやろ？」
ワイ「でも、まだ記事が1件もなかった場合には...」
TypeError: Cannot read property 'title' of undefined
（undefinedからtitleを読み取れません）
ワイ「↑こんな実行時エラーが発生してしまうんや」
ワイ「0番目の記事がundefinedになってしまうからな」
ワイ「せやから」
**0番目の記事が存在する場合だけ、**それを表示する
ワイ「みたいな」
ワイ「条件式を書くように気をつけなあかんのや」
ワイ「実行時エラーが出ないように気をつけてコーディングする」
ワイ「そして、実際にエラーが出てないかどうか」
ワイ「しっかりブラウザ上で確認するんや」
ワイ「それがプログラミングや」
ワイ「つまり、さっきのなぞなぞの答えは...」
ワイ**『実行時エラーの出ない言語などない！』**
ワイ「これが答えや」
娘「ブッブー」
娘「答えは Elm です」
ワイ「いや、そんなわけないやろ...」
娘ちゃんのライブコーディング開始
娘「Elmの場合、0番目の記事を取得するには」
newestArticle =
Array.get 0 articles
娘「↑こう書くんだけど」
div []
[ h2 [] [ text "最新記事" ]
, span [] [ text newestArticle.title ]
]
娘「それを↑こんな感じで画面に表示しようとすると...」
娘「そもそもコンパイルが通りません！」
Type Mismatch
ThisnewestArticlevalue is a: Maybe Article
娘「↑こんなコンパイルエラーが出ます」
娘「つまり...」
型の不一致
newestArticleの値はMaybe Articleです
娘「↑こう言う意味だね」
ワイ「何やMaybe Articleって」
ワイ「何で多分記事やねん」
娘「だって、パパもさっき言ってたけど」
娘「記事は必ず存在するとは限らないでしょ？」
娘「サービス開始当初は0件かもしれないじゃん？」
娘「Elmでは、0番目の記事が存在しなかった場合のことも想定していないと」
娘「そもそもコンパイルが通らないの」
娘「つまり、存在するかしないか分からないような値を」
娘「そのまま画面に表示させようとしても駄目なの」
ワイ「ほな、どうすえりゃええの...」
娘「case式を使って、記事が存在しなかったケースのコードも書いてあげると」
娘「ちゃんとコンパイルが通るの」
case newestArticle of
Just article ->
div []
[ h2 [] [ text "最新記事" ]
, span [] [ text article.title ]
]
Nothing ->
text ""
娘「↑こんな感じだね」
娘「newestArticle、つまり最新の記事がNothingだった場合は」
娘「空文字を表示、つまり何も表示しないってことだね」
ワイ「おお、ちゃんと全て想定してコードを書かないと」
ワイ「そもそも先へ進めへんのか」
娘「そう」
娘「記事の情報ってAPIとかから取得してくるから、」
娘「実際にシステムが動いてみないと、何件あるかなんて分からないでしょ？」
娘「コードを書いてる段階では何件なのか分からない」
娘「0番目の記事は存在するかもしれないし、存在しないかもしれない」
娘「そんなシュレーディンガーの猫ちゃんみたいな不確定な値も」
娘「Elmが事前に検査してくれるから」
娘「プログラマーは忘れずに想定・対応できて」
娘「結果的に実行時エラーを見ることはまず無いの」
ワイ「ドジっ子なワイにはピッタリかもな」
娘「そうだね」
娘「気をつけてコーディングして、気をつけてブラウザテストするより」
娘「想定できるようなエラーはコンパイラにブロックしてもらう方いいじゃん？」
ワイ「さすが娘ちゃん、相変わらず才気走ってんな...」
ワイ「ハスケル子ちゃんもElm良いって言うてたし」
ワイ「ワイも勉強してみよかな...」
そんなこんなでお昼ごはん
ワイ「はぁ...実行時エラーが出ない言語なんてあったんやな...」
ワイ「今までブラウザでぽちぽちテストして」
ワイ「undefinedエラーが出て、そんなことばっかり繰り返しとったわ...」
ワイ「しかもワイ、ミスが多い方やし...」
ワイ「もっと早くコンパイル言語を勉強しておけばよかったわ...」
ワイ「はぁ...ワイの人生、後悔ばっかりや...」
娘「パパ、後悔したっていいんだよ」
ワイ「え...」
娘「後悔して後悔して、なりたい自分が見えてくるんだよ」
娘「転んで転んで、やっと自分に合った歩き方が分かるんだよ」
娘「またやっちゃった...今度こそは...っていう」
娘「その痛みを忘れない事こそが、明日のパパを変えて行くんだよ」
ワイ「娘ちゃん...！！！」
ワイ「人生何周目やねん...！！！」
娘「...パパの記事って、いつも最後このパターンだよね...」
ワイ「まぁな...」
〜おしまい〜