変数とは？
Updated
2021/8/8 9:18
Author
Jumpei Ikegamiorder
3
プログラミングにおける変数とは？
次のプログラムは、1+1の結果をログに出力するものです。
JavaScript
ここでは、
1+1の結果となる値をsumという変数に代入して利用しています。変数とは、プログラミング言語において、データに名前をつけて扱うための手段です。変数を使うことには、主に次の3つの目的があります。
- データに名前をつけてわかりやすくする
- データを繰り返し使えるようになる
- 実際にはどんなデータが来るかわからないときにも、そのデータを変数として表して処理を記述できる
「変数」という言葉を聞くと「数を扱うためのもの」という印象があるかもしれません。しかし、「変数」というのは英語の "variable" （変化するもの）の訳語であり、実際には「数」という意味は含んでいません。プログラミングにおいても、「変数」は数値データだけを格納するものではなく、文字列など他のデータ型の値も格納されます。
数学における「変数」との類似点と違い
ほとんどの方は、「変数」という言葉を数学の授業で耳にした記憶があるはずです。方程式や関数で出てくるaやxは、変数と呼ばれていました。英語でも同じく "variable" です。
中学高校の数学で登場した「変数」も、上述した3つの目的から使われることが多いです。
たとえば、「2^0 + 2^1 + 2^2 + ... + 2^Nの結果を変数Sとする」みたいなことが数学の証明で使われることがあります。（^は累乗を表します。たとえば 2^2 は2の2乗です。）これは、まさに目的1の「データに名前をつけてわかりやすくする」の一例です。また、変数Sでおいた計算結果は、方程式の中で「S」と書くだけで簡単に何度も使い回すことができます。目的2の「データを繰り返し使えるようになる」です。そして、「2^0 + 2^1 + 2^2 + ... + 2^N」という計算の結果は、1つの数字で簡単に表せるものではありません。それをSとおくことで、「実際にはどんなデータが来るかわからないときにも、そのデータを変数として表して処理を記述」できます（目的3）。
目的3については、関数を考えた方がよりわかりやすいです。たとえば次のような二次関数を考えます。
JavaScript
この関数について考えるとき、xが実際に取る値は1つに決まるとは限りません。逆に言えば、xが実際に取る値を1つに決めなくても、「ある値xに対して2乗して5を足す」という処理を記述しているわけです。
プログラミングにおける関数でも、これと同じことができます。
JavaScript
ちなみに、この関数f(x)で使われている変数xのことを、「仮引数（かりひきすう）」と呼んだりします。「仮」というのは、「実際の値は関数が呼び出されたときに決まるけど、今はわからないから仮に変数xとおきます」という意味です。（なお、プログラミングにおける「関数」については、別の記事で詳しく説明します。）
このように、数学における「変数」とプログラミングにおける「変数」はとても似ています。
では、逆に両者の違いはなんでしょうか？最も大きな違いは、数学では変数の値が数値であることが多いのに対し、プログラミングでは数値以外のデータを扱うことも多いということです。記述する内容にもよりますが、プログラムでは一般的には数値ではなく文字列データを扱うことが圧倒的に多い印象です。また、JavaScriptにおいては、オブジェクト、配列、はたまた関数までをも、変数に格納することができます。
変数を使う必要がない場面でも、使うメリットはある
この記事の冒頭に記載したプログラムでは、変数sumを使っていました。
JavaScript
このプログラムは、変数を使わずに次のように書いても同じ結果になります。
JavaScript
このように、あえて変数を使わなくても期待する動作を実現するプログラムを書ける場面はたくさんあります。
しかし、データはなるべく変数に格納しておいた方が幸せになることが多いです。
たとえば、次のような適当なプログラムを考えます。
JavaScript
"a1234"という謎の文字列をログに出力した後で、searchという関数にその文字列を渡しています。そのとき、またもや謎の"01"という文字列を頭に足しています。これだけだと、何をしたいプログラムなのか全くわかりません。
それでは、変数を使って書いた次のプログラムだとどうでしょうか？
JavaScript
これを読むと、
"a1234"という文字列は商品IDであったことがわかります。またsearch関数はどうやら商品検索のための関数で、使うときはカテゴリIDと商品IDを組み合わせて渡す必要がある、ということも見て取れます。このように、適切な名前の変数にデータを格納することで、そのデータの意味がプログラムを読む人にもわかるようになります。「自分しか読まないプログラムだから読みやすさは関係ない」と思いがちですが、自分が書いたプログラムの内容を1ヶ月後の自分が覚えている保証はありません。未来の自分のためにも、読みやすいプログラムを書くことはとても重要です。ちなみに、プログラムが読みやすいことを「可読性が高い」と言います。また、可読性以外にも、変数を使うことで副次的な効果が得られます。たとえば、検索したい
item_idの値を"a1234"から別の値に変更したいケースを考えます。このとき、変数を使っていない1つ目のプログラムでは、1行目と2行目の"a1234"の両方を修正する必要があります。一方、変数を使った2つ目のプログラムでは、変数item_idに格納している2行目の"a1234"だけを書き換えれば済みます。このように、変数を使って処理を書いておくと、その変数を何回使っていたとしても、値の修正箇所が1つで済みます。今回は使っている箇所が少なかったので大きな問題はありませんが、10箇所を超えてくると修正ミスも出てくるでしょう。このように、変数を使うとプログラムの修正が楽になることがあります。ちなみに、プログラムの修正コストが低いことを「保守性が高い」と言ったりします。
JavaScriptにおける変数の使い方
ここからは、JavaScriptにおける変数の使い方について説明します。変数自体の説明で疲れてしまったのと、JSの仕様は調べればインターネット上にたくさん出てくるので、簡単な解説にとどめます。
ここでは、変数を使ったJSプログラムの例として、チュートリアルで登場したプログラムを考えます。
2. ワンクリックでAmazonの商品名をGoogle検索するボタンを作る2021/6/20 4:332021/8/8 8:00JavaScript
変数を使うことを宣言する
自分で新しい変数をつくるとき、「この変数を使います」ということを宣言する必要があります。「宣言」ってなんやねんという感じですが、「新しく変数を使い始めるときの儀式」くらいに考えてください。宣言をすることの仕様上の目的が知りたい人は、「JavaScript 変数 スコープ」でググってください。
なお、すでに用意された変数を使う場合は、宣言は不要です。
変数の宣言をするときは、
varという特殊な命令を使います。ちなみに、varは "variable" （変数）の略です。JavaScript
次のように変数宣言と代入を別々にすることもできます。
JavaScript
ちなみに、最近のJavaScriptでは
varは非推奨となり、代わりにletやconstという命令を使います。しかし、稀に古のブラウザを使っていると、まだletやconstに対応していないケースがあります。varよりもletやconstの方が便利なことが多いですが、小さなプログラムであればそこまで違いを気にする必要はありません。何も考えたくない人は、古いブラウザがこの世から無くなることを祈りつつ、とりあえずvarを使って変数宣言しましょう。
変数に値を代入する
変数に値を代入するには、イコール記号を使います。
JavaScript
変数の値を取り出す
変数の値を取り出すときは、その変数名をそのまま記述します。
たとえばこのプログラムでは、変数
titleの値を使ってURLを生成しています。JavaScript
titleには文字列データが格納されているので、実際には、 "https://www.google.co.jp/search?q=" + title の部分は「文字列 + 文字列」となり、文字列同士の結合が行われます。