![[De]](https://interaktiv.chemie.uni-mainz.de/programming/flags/de.svg)
なぜ JavaScript か
最初にも書いたように、初心者にとっての最大の障壁は環境構築にある。 JavaScript はブラウザーとエディター (例えばメモ帳) があれば動かすことができるので、その障壁がほぼない。 さらに、この文書ではウェブブラウザー内で試すことができるようにしているので、エディターなしでも、つまり 全く準備なしで 始めることができる。
なお、本テキストは「自然科学者のための プログラミング 入門」であって、「JavaScript 入門」ではないことに注意されたい。 そのため本テキストでは JavaScript 固有の話は極力避け、プログラミングに関する一般的な (共通的な) 基礎の習得を目的としている。
実行環境の構築
この文書ではウェブブラウザー内で試すことができるようにしているので、まずは何もしなくて良い。 ただし後半ではプログラムが長くなるので、きちんと環境構築した方が良い。 JavaScript 実行環境の構築の概要を別ページにまとめたのでそちらを参照して欲しい。
最初の一歩
Hello, world
新しい言語を学ぶ時はまず最初に Hello, world! を表示することになっている。
console.log("Hello, world!");
下のテキストボックスに Hello, world! と表示されたであろうか。
これはたった一行ではあるが、立派なプログラムである。
プログラムの説明
簡単にこのプログラムの説明をしておく。
-
console.log(...) -
console.logというのは、(…)の中身を 表示せよ、という命令だと思っておこう (厳密に言うとちょっと違うが、そ の辺は今は気にしなくて良い)。 -
"…" -
ダブルクォートは文字列であることを示すための記号である。 文字列を表示するにはダブルクォートで括る必要がある。 JavaScript の場合はシングルクォート
'…'でも良い1。 -
; -
最後のセミコロン (
;) は「これでこの文は終了」という意味である。 実は JavaScript では行末の;はなくても動くが、最初のうちは文の区切りを意識するために入れておいた方が良いだろう。 なお、一行に複数の文を書く場合は;が必要である (が一行に二文以上書くのはおすすめしない)。console.log("Hello"); console.log("World"); // 最後の ; は省略できる
計算してみる
例えば、
console.log(1 + 2);
と入力して実行してみよう。
+ の前後の空白はあってもなくても良い。
さきほどの例と違ってダブルクォート " が無いことに注意しよう。
上の計算を実際に実行してみよ。
正しい答が表示されただろうか。
もし、計算結果ではなく 1 + 2 という文字列を表示させたい場合は、ダブルクォートもしくはシングルクォートで囲む。
console.log(1 + 2);
console.log("1 + 2");
どのような計算ができるか、どのようにするかについては後で詳しく学ぶが、ひとまずいろいろ試してみよう。
console.log(1 + 2);
console.log("1 + 2");
を実行してみて、何が起きているか確認せよ。また括弧内をいろいろ変えて試してみよ。
なお、 console.log(...) では括弧の中をコンマ (,) で区切って複数書くことができる。
例えば、
console.log("Hello", 1);
と書ける。
繰り返しになるが、
console.log("1");
console.log(1);
は表示されるものは同じだが、意味が異なる (前者は文字列として、後者は数値として) ことに注意しよう。
まとめ
-
簡単なプログラムを書いて実行してみた
-
console.log(...)を使ってみた -
文字列は
"…"(または'…') で囲む
ここまでは肩慣らしであった。次から本格的に学んでいく。
この文書の読み方
この文書は原則、最初から順に読むことを前提として書かれている。 既にプログラミングの基礎を身に付けているのであれば「応用編」から読んでも良い。
各項目へは上部のメニューから飛ぶことができる。 また、各ページの上部及び下部にあるリンク (図 1) で前後に進むことができる。 のリンクをクリックしていけば、最後まで順番に読み進めることができる。
全体の目次は以下の通りである。
別の言語 (C言語など) ではダブルクォートとシングルクォートで意味が異なる場合があるので注意。