JavaScript 変数と定数名前付けのルールと値の書き方

いよいよ今回から「JavaScript」についてご紹介させて頂きます。

今まで学習してきたHTMLやCSSとは違い、JavaScriptはプログラミング言語になりますので、学習を進めていくうちに、戸惑われることも多いと思います。

しばらく覚えなくてはならないことも多く、概念的な内容が続くので、挫折してしまいがちですが、分からないときは無理せず急がずに、ゆっくりと学習していくようにしてください。

ある程度の基礎が身につくと、途中からスッキリしていくと思います。

JavaScript

JavaScript とは

JavaScript（以下JS）とはとても簡単に言うと、「動的」なことが出来るプログラミング言語です。

今まで学んできた、HTMLやCSSが「静的」なものだったのに対して、JSはイベントの利用やポップアップを表示したりすることが出来る「動的」なものになります。

変数

変数とは

変数とは値の入れ物（ボックスのようなイメージ）であり、変数が持っている値を変更することが出来ます。

またテキストや数値だけでなく、データや関数自体を格納することが出来ます。

変数を宣言する

変数宣言

変数を宣言するには、「let」を使います。

（定数を宣言する場合は「const」になります）

let myName;

初期化する

myName = 'Jiro';

変数宣言をしたら値を入れるだけで初期化されます。

この後にコンソールに「myName」と打ち込めば名前が表示されるはずです。

変数宣言と初期化は通常1行に書きますので、この場合は以下のようになります。

let myName = 'Jiro';

値を変更する

myNmae = 'Taro';

変数の値を変更するには、もう一度値を入れ直せばOKです。

JSについてコードを調べたりしていると、「var」という単語を目にすることが多々あると思います。

「var」と「let」の違いについて詳しく書くことは割愛させて頂きますが、「var」はJSの初期からあり一般的に使用されてきたものになります。

しかし、幾つかの問題を引き起こすことが知られていて、そのため、その問題を解決するために使用されるようになったのが「let」になります。

「var」で書かれているJSも数多く存在しますが、これから学習を始める方は「let」を使うようにしてください。

変数の名前付けルール

アルファベット、数字、アンダースコアで作る
先頭はアルファベット（小文字）を使用する（数字、アンダースコアはNG）
英単語をつなげるときはキャメルケースを使用する（後に続く単語の最初の文字を大文字で書く）
大文字小文字は区別される

（例）

◎：name, myName, name01, afterCovid

☓：Name, myname, 01name, aftercovid

上記のルールに則っていれば、自由に名前を付けることが出来ますが、以下代表的な付け方の例になります。

キャメルケース

let myName =
let totalScore =

最初の単語は小文字で、2番目の単語の最初の文字を大文字で書く方法を「キャメルケース」と言います。

最もポピュラーな方法です。

パスカルケース

let MyName =
let TotalScore =

単語の先頭の文字だけを大文字で書く方法を「パスカルケース（アッパーキャメルケース）」と言います。

スネークケース

let my_name =
let total_score =

すべての単語を小文字にして、単語をアンダーバーでつなぐ方法を「スネークケース」と言います。

予約語

JavaScriptでは一部の単語が予約語として扱われていて、変数や関数で利用できないようになっています。

予約語は利用しようとするとエラーが表示されますが、単語によっては稀に表示されない場合があります。

しかし思わぬエラーやトラブルの元になりますので、使用しないように気をつけましょう。

以下代表的な予約語になります。

			予約語
await	break	case	catch	class	const	continue
debugger	default	delete	do	else	enum	export
extends	false	finally	for	function	if	implements
import	in	instanceof	interface	let	new	null
package	private	protected	public	return	super	switch
static	this	throw	try	true	typeof	var
voild	while	with	yield

値の書き方

値を書く際には注意しなくてはならない点が幾つかあります。

数値 (number)

let myAge = 40;

「40」という数値を書く場合はそのまま書きます。

文字列 (String)

let myName = 'Jiro';

文字列を入力するときは、クオテーションで囲む必要があります。

ダブルクオテーション、シングルクオテーションのどちらでも構いませんが、シングルクオテーションの方がベターです。

（共同で作業するときはそれぞれのルールに従ってください）

文字列として数値を入力するときは必ずクオテーションで囲んでください。

真偽値 (boolean)

let live = true;

条件を判定するために、「true」または「false」が使われます。

配列 (array)

let myName = ['Jiro', 'Taro', 'Hanako']; 

myName[2];
'Hanako'

複数の値を格納するには、「[]」で囲ってカンマで区切って記述します。

配列中の位置を指定すれば、名前が表示されます。

なお、JSでは最初は「０」から数えますので「Hanako」は「2」になります。

オブジェクト (object)

let myName = { name : 'Jiro', age : '40'};

myName.age
'40'

詳細は別記事で詳しく解説させて頂きますが、プロパティを集めたもの（幾つかのデータを集めたもの）と覚えておいてください。

ここでは「name : ‘Jiro’; 」と「age : ’40’;」がプロパティになります。

（先程ご紹介した配列も広義の意味ではオブジェクトになります。）

自分が書いているコードの型がわからないときは、「typeOf」演算子のあとに、数値やテキスト、変数などを記述すれば、どの型か返してくれます。

typeof name
'object'

typeof (1+1);
'number'

typeof 10
'number'

typeof '10+10';
'string'

typeof onappinstalled;
'object'

typeof banana;
'undefined'

typeof 'banana';
'string'