二回目ーー変数と定数ーー
今回は変数についてです。
二回目は、前回の文字列・数値表示に続き変数について学びました。
変数とは、文字通り変わる数のことで、有体に言うと代入の事ですね。
xやyに数値を代入して計算するなどがそれに当てはまり、『JavaScript』では入れ物に名前を付けて数値や文字列を入れることを言います。
少しややこしい部分がありますが、基本の形が変わることはなかったのでそっくり覚えておこうと思いました。
１．変数の使い方
変数とは代入する計算の事。
コードの形は
『let 変数名(入れ物) = “値”(文字列や数値);』
このようになり、変数名を使うことで値を何度も簡単に使える様になります。
算数や数学の『＝』は等しいという意味がありますが、プログラミングでは【右辺(値)を左辺(変数名)に代入する】という意味になります。
『let』は【これから変数を行います】という宣言です。
let name = ”山田”;
『name』という入れ物に『山田』という値(文字列)を入れる。
let number = 6;
『number』という入れ物に『6』という値(数値)を入れる。
使い方としてはこのようになります。
前回と同じく、注意点は【数値には『””』を使わない】という所です。使った場合は文字列とパソコンは読み取ってしまうので、計算しようとしても計算できなくなります。
この状態で入れ物に値を入れたことになり、次にその入れ物に入れた値を表示させます。
今の段階はあくまでも入れただけということですね。
そのために使うコードが
console.log(変数名);
前回と同じコードとなります。
ここで『””』を使うと文字列認識をしてしまうので、ここでも使わずそのまま同じ変数名を書き込む必要があるのが注意点です。
let name = ”山田”;
console.log(name);
『山田』と表示される。
×console.log(“name”);
『name(文字列)』と表示されてしまう。
let number = 6;
console.log(number);
『6』と表示される。
以上が変数の基本となる形です。
２．連結
文字通り文字列や数値を連結することです。
これが一体何に使えるかというと、今学んだ限りではあまり有効な手段は無いように思えます。
ただ、入れ物に入れた値は何度も使えるので、一々同じようなコードを書かなくてよくなります。
連結の仕方は足し算と同じく『+』を使います。
文字と文字をくっ付けると考えたらいいのではないでしょうか。
let name = “山田”;
console.log(name + “さん”);
『山田さん』と表示される。
let number = 6;
console.log(number + 6);
『12』と表示される。
console.log(number * number *4);
『40』と表示される。
×let number = “6”;
console.log(number + 6);
『66(文字列)』と表示されてしまう。
文字列には『””』が必要、数値には不要というのを覚えなければいけません。
変数を使うことのメリットは
●変更が容易である
幾つも同じコードがあると全てを書き換えなければならず、変数を使えば値だけを帰れば良いので一瞬で変更できる、ということです。
●何度も繰り返し使える
先ほども触れましたが、『name』や『number』を何度も使えるということで、上記との関連性がとても強いメリットです。
●値の意味が分かりやすい
入れ物の名前と関連付ければ更に値の意味が分かりやすくなります。国(country)、果物(fruit)、本(book)などです。
入れ物に入れる値が複雑で長くなるほど、何度も使うものほどメリットは強くなるので、変数は重要なプログラムなのです。
３．変数の変更
即ち、入れ物に入れた中身を変える、ということです。
あまり考えずとも『同じ入れ物に別の値を入れるコードを書けばいい』と思い付くでしょう。
しかし、二度目には『let』を必要としません。
『let』は変数を定義するらしいので、二度目からは使わず省略して書けるようです。
let name = “山田”;
name = “鈴木”;
cosole.log(鈴木);
nameに入っていた山田を『鈴木』に変える。
このような感じで使います。
注意点というよりプログラミングの基本通り、機械は上から読み込むので、最終的に入れられた値が表示され使われることになります。
ひとつ前に入れた物を取り出そうとしても取り出せないということです。
この応用として同時計算も出来ます。
let number = 6;
number = number + 6;
console.log(number);
入れ物に『12』が入り、『12』が表示される。
以降numberは6ではなく『12』が使われる。
この計算には『入れ物+=数値』『入れ物*=数値』と省略して書けるようですが、慣れるまでは基礎を使うことが近道と思いますね。
これの使い道と言いますか、この段階で小学生低学年の算数計算は熟せるようになりました。
10人にお菓子を5つずつ配ります。
その内2つを食前に食べて良いとします。
お菓子は全部で幾つ必要となり、1人当たりの残りのお菓子と全体の残りのお菓子は幾つになるでしょう
小学生には少し難しいですが、このような問題があれば
let children = 10;
snack = 5;
console.log(children * snack);
全体のお菓子の計算と表示。【50】
snack = snack – 2;
console.log(snack);
食前に食べた後の一人当たりの残りお菓子と表示。【3】
snack = snack * children;
console.log(snack);
食べた後の全体の残りお菓子の計算と表示。【30】
普通に計算すれば三行で終わる簡単な計算なのですが、プログラミングではこのような感じにコードを書くことになります。たぶん。
４．定数について
変数と定数。
定数も文字通り『定められた数字』のことです。
『let』の代わりに『const』を使い、基本的には使い方は同じです。
違う所は、『定められているため入れた値を変更できない』というところにあります。
一見不便に思えますが、ゲームなどを作っているとコードの間に別の長いコードが入ってきて何を入れたのか、もしかしたら途中で変わっているかも、予期せぬ変更に対応できます。
今の段階では問題ないので不便なものと認識していますが、入れ物がたくさん増えて来たら混乱は必須と思えるので必要なコードなのでしょう。
５．テンプレートリテラル
簡単に言うと、変数や定数を連結しましょう、ということです。
『+』を使えば簡単なのですが、文字列と文字列の間などにも埋め込むことができます。
使うのは『`${変数や定数}`』です。
【``(shiftと@)】、ドルマーク、例のかっこ
const name = “山田”;
let age = 6;
console.log(`${name}は現在${age}歳です。`);
age = age + 1;
console.log(`今年の3月に${age}歳となります。`);
こんな感じに使えます。
色々と複雑ですが、基本は最初の部分だけなので覚える所はそれほど多くありませんでした。
難しく感じるのは頭では計算できているのに書くべきコードがたくさん増え複雑になったり、入れ物に入れてしまうということで頭の中が混乱するからだと思います。
それも何度か自分で計算問題などを作ってみるとすんなり納得できるのでお勧めですね。
最終目的
・勿論手に職を付ける、若しくはお金を稼ぐ
・簡単なゲーム(リバーシや簡易シューティングなど)を作る
・フリーソフトで販売
短期目標
・大まかな流れを覚える
・プログラミングを理解する
上記の内容は覚える中で変わることがあると思います。
