Skip to content

JavaScriptとは ​

後期ではJavaScriptという言語を使用していきます。名前がJavaに似ているから「もしかして関係あるのか?」とか思う人がいるかもしれませんが全く関係ありません。全然違います。グレープとグレープフルーツくらい違います。

目次 ​

JavaScriptの成り立ち ​

JavaScript(略してJS)は、主にWebブラウザ上で動作し、動的な表現やインタラクティブな機能を実現するために開発されたプログラミング言語です。要は「Webサイトをもっときれいに、もっとわかりやすく」するために作られた言語です。

前期に使用したJavaはバックエンドで使われることが多いですが、JavaScriptはフロントエンドでよく採用される言語です。主にHTMLやCSSと一緒に使われます。

また、Node.jsを使用することでバックエンドとしてサーバー側のプログラムを作成することもできるようになるため、かなり万能なプログラミング言語になってきている印象。

JavaScriptの特徴 ​

1. 動的型付け言語 ​

JSでは変数宣言時に型を指定する必要がありません。JavaやC++の場合は変数宣言時にint xのように型を宣言する必要がありましたが、JSで変数を宣言するときはconst xまたはlet xのように書きます。
constは定数、letは変数を宣言するときに使用します。constで宣言すると初期化後に値を再代入することができません。何度も値を代入したい変数にはletを使い、それ以外の場合には基本的にconstを使うようにしましょう。

javascript
const x = 0;
x = 1; // エラー

let x = 0;
x = 1; // エラーにならない

TIP

昔はconstやletのように使い分けることはなく、すべての変数宣言時にvarを用いていました。が、これは現在非推奨となっています。基本的にはconstとletを使用するようにしましょう。

また、型を宣言する必要がないと言いましたが、JSに型が存在しないわけではありません。
JSではプログラムの実行時に自動で型が決定されます。これを動的型付けといいます。基本的な型は以下の通りです。

型意味備考
number数値intやdoubleなどの区別がない。数値であればnumber型として扱われる。
string文字列charはない。
boolean論理値(ブール値)JavaとかC++といっしょ

2. インタプリタ言語 ​

JavaやC++はコンパイル言語であるのに対して、JSはインタプリタ言語です。PythonやPHPなどもインタプリタ言語です。

インタプリタ言語はコンパイルを行う必要がなく、そのまま実行することができます。どのように実行しているかというと、「プログラムの実行時にソースコードを1行ずつ機械語に翻訳し、その都度実行する」といったような方式をとっています。

インタプリタは1行ずつプログラムを実行するため、作成途中のコードだとしても一度実行して動作を確認することができます。また、エラー箇所を特定しやすいというメリットもあります。

一方で、翻訳→読む→実行といったプロセスを1行ずつ毎回繰り返すため、実行速度が遅くなります。

3. Webブラウザで動作する ​

JSは基本的にWebブラウザで動作する言語です。私たちが実行コマンドを打つことはなく、JSが埋め込まれたHTMLを開いたりすると自動的に実行されます。Node.jsを使用することでJavaなどのようにコマンドを使って実行することもできますが、この講座ではしばらくはやるつもりはありません。

冒頭にもある通り、JSはHTMLと一緒に使用されます。具体的には、HTMLの<script>タグによってJSプログラムをHTMLの中に埋め込む手法で実行されます。

JavaやC++経験者への注意点 ​

等価演算子は==ではなく===を使う ​

JavaScriptで値が等しいかを調べたいときには基本的に===を使用してください。==では厳密な判定をしてくれません。具体的には、型が違っていても==ではtrueになってしまいます。

javascript
console.log(1 === "1"); // false
console.log(1 == "1"); // true
console.log(0 == false) // true

同様に、!=ではなく!==を使うようにしてください。それ以外の比較演算子は他言語と同様の仕様になっているはずです。

文字列について ​

JSの文字列は'と"どちらで囲っても構いません。

javascript
const str = 'あいうえお';
const str2 = "かきくけこ";

文字列の中に変数の値を埋め込みたい場合、${}を使った記法で実装できます。

javascript
const x = 20;

const str = `わたしは${x}歳です`; // わたしは20歳です

型変換 ​

JSで型変換を行うためには専用の関数を用います。まあ見ればわかります。

javascript
const x = 5;
const y = 10;
const xStr = String(x);
const yStr = String(y);

console.log(x + y); // 15
console.log(xStr + yStr); // 510
javascript
const str = "5";
const str2 = "10";

console.log(Number(str) + Number(str2)); // 15