それでは、いよいよプログラムを進めていきます....

が、その前に、ちょっと下ごしらえしておきます。

本書は、あくまで「アマグラマーのすすめ」であって「プログラマーのすすめ」ではありません。料理本を一冊読んだからといって調理士にはなれないように、本を一冊読んだぐらいではプログラマーにはなれません。それがどんな名著でも。

本書がめざすのは、読者に「プログラムってこんな感じなんだ」という、だいたいの感じをつかんでいただくことです。料理にたとえれば、サンドウィッチのパンは外で買ってきて、具をいろいろと作ってみるという感じでしょうか。

というわけで、以下は本書で使う「パン」に相当するプログラムです。この時点で意味はわからなくても結構です。私のblogからそのままコピーしても構いません。これに適当な名前を付けて保存しておいてください。「パン」なので"bread.html"とでもしておきましょうか。

bread.html
<script>
function p(s){
  document.getElementById('stdout').innerHTML += s + '<br>';
}
</script>
<dl>
<dt>プログラム:</dt>
<dd><textarea id="src" cols="80" rows="25"></textarea></dd>
<dd><input type="submit" value="実行" onclick="
  document.getElementById('stdout').innerHTML = '';
  document.getElementById('stderr').innerHTML = '';
  try {
    eval(document.getElementById('src').value);
  }catch(e){
    document.getElementById('stderr').innerHTML = e;
  }
"></dd>
<dt>出力:</dt>
<dd><div id="stdout"></div></dd>
<dt>エラー:</dt>
<dd><div id="stderr"></div></dd>
</dl>

これをブラウザーで表示すると、以下のようになるはずです。

プログラム:
出力:
エラー:

この入力フィールドに、JavaScriptのコードを入れて「実行」ボタンを押すと、その結果が「結果」のところに表示されるという案配です。試しにp(1+1)と入力してみましょう。

出力のところに2と表示されたでしょうか?

今度は、でたらめに何か打ち込んで「実行」ボタンを押してみましょう。今度はエラーのところに何か英語で表示されたはずです。

本書では、以降この「パン」に「具」となるプログラムを「はさみこむ」ならぬ「打ち込む」形で、実際にJavaScriptを体験しながら、プログラムとは「どんな感じ」のものかを体験していくことになります。

Dan the Programmer