JavaScriptの魅力とプログラムの書き方について

はじめに パソコンを使っているけど、市販のソフトや、誰かに作ってもらったソフトを使っているだけ、プログラムなんて自分には無縁だと思っているひとは多いと思います。でも、JavaScript を使えば割と簡単に、便利なプログラムをつくることができます。Q&Aキットの簡単計算フォームも JavaScript で作成してあります。 　「一番簡単な JavaScript」では、プログラムを組んだことがないひとが、実用的な計算ができるようになること、を中心に進めていきたいと思います。 JavaScriptとは何か インターネットの、このページのような文書は、HTML（Hyper Text Markup Language）で書かれています。ここをクリックしてみてください。一番簡単な JavaScript の後に、1～100の数字が付いて、100行表示されたはずです。その中身は、次のようになっています。ではじまって、で終わる html 文書の中で、までが javascript です。たったこれだけ書くだけで、100行の文字列が表示できるんですから、簡単そうに見えませんか？　for(i=1 ; i<=100 ; i++) の部分の100の数値を変えれば、何万行でも表示できます 特別なソフトが必要ない ふだん使っているWebブラウザで動きます。プログラムを書くのも、普通のテキストが編集できるエディターがあればできます。たとえば メモ帳（notepad）でもOK です。 JavaScript の書き方 最後が ; で終わる 　エディターで見える行は関係なく、最後は必ず ; です。そのため、上の JavaScript の部分を、 var i; for(i=1 ; i<=100 ; i++) document.write("一番簡単な JavaScript"+i+"
“); というように、続けて一行に書いても同じ様に動きます。けれども、見た目でプログラムの構造がわかりやすいように、ふつうは改行してインデントをつけて書きます。 ● まとめてブロックにするときは { } でかこむ for(i=1 ; i<=100 ; i++) { document.write(“一番簡単な JavaScript “+i+”
“); document.write(“二番目に簡単な JavaScript
“); } document.write(“三番目に簡単な JavaScript
“); と書けば、一番… と 二番目… はブロックになっているので、for(i=1 ; i<=100 ; i++) により 100回表示され、三番目... はその後で1回だけ表示されます。 大文字と小文字は区別する 　abcd　Abcd　aBcd　は区別されます。後で説明する、変数名や関数名を付けるときも、注意が必要です。 コメント 　良くあることですが、自分で書いたプログラムを、自分で理解するのが難しくなる場合があります。書いたひと以外が見る場合はなおさらです。 var i; // iを変数として宣言 for(i=1 ; i<=100 ; i++) //i=1からはじめて、1ずつ足していって、100まで繰り返す document.write("一番簡単な JavaScript "+i+"
“); /* document.write はドキュメントに書きこみます。
はHTMLの改行です。これがないと表示されません。*/ というように、一行のコメントは // ではじめて、複数行のコメントは /* と */ で囲みます。 代入 = ／ 比較 == 　i=0 は変数 i の値を 0 にするということです。i が 0 と等しいか調べるときは、i==0 と書きます。if(i==0) は、i が 0 なら、という意味ですが、if(i=0) と書くと、i に 0 が代入されるので、常に真になってしまいます。 計算をしてみる 加算：+ , 減算：- , 乗算：* , 除算：/ , 剰余：% 　そろそろ、計算してみましょう。演算子は上のように、ふつうのものはあります。この演算子を使った簡単な例はここをクリックしてください。その中身は、次のようになっています。 　 var は、変数の宣言するときに使用します。data～dateの、5つの変数を宣言しています。変数を宣言するとき、整数型とか文字型といった型を指定する必要がありません。そのため、data = 10 + 10; の部分を、data = “こんにちは”; と書き換えても、正常に動きます。なお “こんにちは” のように、文字は ” または ‘ で囲みます。 　演算子で注意が必要なのは、+ です。+ は、数値の加算だけでなく、文字をつなげるときにも使います。data = “こんに” + “ちは”; と書くと、data には “こんにちは” が代入されます。datb の値が5なら、data = “こんに” +datB+ “ちは”; と書けば、data には “こんに5ちは” が代入されます。ここまでは、まあいいんですが、変数の型が指定されていないために、10 + 10 = 20 という計算をするつもりが、”10″+”10″=”1010″ となってしまったりもするんです。

( + ) * =

　これは、フォームを使用して、入力した数値を計算するものです。からがHTML文書の本文ですが、この中のがフォームで、名前は “form01” です。 y x >= y x < y x <= y 意味 x と y が等しけれが真 x と y が等しくなければ真 x が y より大きければ真 x が y 以上なら真 x が y より小さければ真 x が y 以下なら真 eval で簡単な電卓 　 先に出た eval は、数値だけでなく、数式も評価して数値にします。ここをクリックしてください。上側のテキストボックスに計算式を入力してから、[計算]ボタンをクリックすると、下側のテキストボックスに計算結果が表示されます。中身は次のようになっています。

計算式：
計算結果：

　 calc という関数の部分がとても簡単になっています。上側のテキストボックス（txt01）内の計算式を eval で評価して数値化し、下側のテキストボックス（txt02）に表示しているだけです。なお、with というのは、既定のオブジェクトを指定するもので、この中では document.form01 と何度も書くのを省略することができます。次回も、興味深い話題でお会いしましょう。それでは、また！

この記事はきりんツールのAIによる自動生成機能で作成されました