超初心者に解説するプログラミング用語！まずは変数、関数、属性、メソッドを理解しよう ー 『JavaScriptでやる1分間プログラミング』メモ

【変数・Variable】データは「入れ物」に入れてから使う

突然ですが皆さん、料理をしたことがありますか？例えば簡単なところでチャーハンなんかどうでしょう。ごはんを卵と混ぜて炒め、パンチをきかせたければニンニクも入れます。そして塩とコショウで味を調え、最後に醤油で香りをつけます。

そこで卵、塩、コショウ、醤油などの材料や調味料をフライパンに入れるときに、例えば容器から直接ドバドバ―っと醤油をかけますか？

まあ気軽な調理ならそうでしょうが、しっかりとしたやり方としては必要な材料は必要な分だけ小皿などの容器に入れて用意をしておきます。

はい、プログラミングの「変数」ってこんなイメージで考えておいてください。

プログラミングというのはコードを書いてあらゆる「データ」をグルグル回すような処理をすることです。その時、そのデータというのは必ず入れ物に入れないといけません。例えば、プログラムを書いてくださいと言われて、次のように計算式を書いたらどうなると思いますか？

3 + 4

こんなの計算機だったらすぐにやってくれて、画面に７を表示するはず。でもプログラミングはいろんな処理を続けてやるものです。足すだけではなく、引いたり、掛けたり…。一回切りの計算機と違って、複雑なデータ処理をするのがプログラミングです。なので、プログラミングで3 + 4とやると「後が続かない」のです。

プログラミングでの正解は、これを「入れ物に」入れてあげることです。

number = 3 + 4

ここではnumberという入れ物を用意して、そこに計算の結果を入れています。初心者でちょっと戸惑うのはこの＝という記号。これって”同じ”を意味する「イコール」ではなかったでしたっけ？プログラミングで ＝ というのは”ぶち込む”（代入する）という意味で、どちらかというと ⇐という記号の のほうがイメージに合っています。

number <= 3 + 4

でもプログラミングではこの「ぶち込む」操作には＝を使いますので覚えておいてください。ではイコールを表したい時はどうするか。それはまた別の機会にお話しします。

さて、このnumberという入れ物に3+4 を入れた際のイメージはこんな感じになります。入れ物の中で計算結果の７が収まっているわけです。

numberという容器にデータが入ったら、あとはnumberという入れものをいじくるのがプログラミングです。例えば、

alert(number)

このalert（アラート：警告する）はブラウザ内にポップアップメッセージを表示させます。つまり、numberの中身（つまり７）をポップアップで表示してくれます。

あるいは、

number = number - 5

こうすると、numberに入っている7から５を引いた２が、新たにnumberに入ることになります。

こうやってデータの処理はすべて入れ物にいれてやらないといけないのがプログラミング。そしてこの入れ物のことを「変数」というのです。なぜ「変わる数」かというのは今の例で分かります。numberという数値はぶち込む値によって７になったり２になったりしました。入れ物には何を入れても構わないので、一つの入れ物を使いまわしながら様々なデータが出入りします。

プログラミングのコードを見ると数字だけではなく文字がいっぱい入っていますよね。あの中の相当な部分が「変数」だと思ってください。いろんなデータをいろんな入れ物にいれて処理するため、目がくらむような文字の羅列になります。

最初に説明した通り、料理にしてみればこんな感じでいろんな材料（データ）がたくさんの小皿（変数）に入っているようなものです。

こう考えるとあのクラクラさせるようなプログラミングコードも、少しは具体的なイメージを持ってみることができるのではないでしょうか。恐れるに足りずです！

【関数・function】 ”やる事”も入れ物に入れてから使う

変数に文字を入れたい場合は引用符を使います。

name = "itagaki"

さてここであなたは一つの「プログラミングの仕事」を頼まれました。

それは、「英語の単語はすべて最初の文字を大文字してください」というタスクです。例えば"itagaki"は"Itagaki"にしたいわけです。でも文書ファイルには単語は何千語と入っています。それ一つ一つ手作業で変えていくのでしょうか？

また料理に例えるなら、米を炊くときに炊飯器を使いますよね。あれです。コメは鍋でも炊けますが、水加減や火加減を毎回微妙に見てやらないといけないので大変です。炊飯器は水と米を入れたら簡単に炊いたご飯が出来上がります。

何度も同じ処理をするからこそ炊飯器は重宝するわけです。プログラミングでも同じ処理は炊飯器のような「入れ物」に入れておけると、なんども使いまわすことができて便利です。

この炊飯器のような入れ物が「関数」だと理解してください。

関数の入れ物は何か処理をする仕組みが中に入っていて、データを入れるとその処理が開始されます。箱の中にベルトコンベアみたいなものが入っているというイメージを持ってください。

この「関数の入れ物」をコードで書くとこうなります。

function Omoji (name) {

・・・ここに文字変換のコードを書きます・・・

}

JavaScriptではこの関数（function）の”セクション”は中括弧（｛と｝）で囲まれた部分です。この関数にnameという文字のデータを入れると、最初の文字だけが大文字になって返ってきます。

実際の大文字変換の関数を使ってみます。何をやっているかわかりますか？

name = "itagaki"
name = Omoji (name)
alert(name)

最初に"itagaki"という文字列をnameという変数に入れ、その入れ物をOmoji関数に投げ入れます。するとこの関数は最初の文字だけ大文字にして返すので、name変数には"Itagaki"が入ってきます。これをalertを使ってポップアップ表示させると"Itagaki"が出てきます。

どうですか？「変数」と「関数」は理解できましたか？ プログラミングではこの変数と関数を使ってデータを処理していくというのがその根幹です。変数と関数に慣れるとプログラミングが何をするのかよくわかってくることでしょう。

【属性・Property】 変数の入れ物にはいろんな「情報」が隠されている！

さてデータは変数という入れ物に入れて使うということでしたが、実はこの入れ物、単なる”容器”ではありません。いろんな「情報」を提供してくれる優れものなのです。例えば次のコードを見てください。

name = "itagaki"
mojisu = name.length
alert (mojisu)

最初に"itagaki"という文字列をnameという変数に入れているのはもうお分かりだと思います。問題は次。name.lengthって何なのでしょう。これは文字通りlength（長さ）のことなのです。

name.length ⇒ nameに入っているデータのlength（長さ）

つまりここでは"itagaki"という文字列の長さです。それは７文字ですよね。そこで、その数値を今度はmojisu（文字数）という変数の入れ物に入れ、それをalertを使ってポップアップ表示させています。例を見てください。

このように変数にピリオド（ドット）を付けるといろんな属性にアクセスができます。文字列の場合はその文字数を常に知ることができます。この情報のことを属性（Property）といいます。プロパティと言うことも多いので両方覚えておいてください。

どのようなプロパティが利用できるかはデータによって大きく異なります。とりあえず今は、文字列のプロパティにはlengthがあると覚えておいてください。

【メソッド・Method】変数の入れ物にはいろんな「動作」も隠されている

変数の入れ物にはまだすごいことがあります。プロパティという情報だけではなく、「何かをしてくれる動作」も備えられているのです。

name = "itagaki"
name = name.toUpperCase()
alert (name)

これは"itagaki"という文字列が入ったname変数が持っているtoUpperCase（”大文字へ”という意味です）というメソッドを、属性の時と同様にドットを入れて呼び出しています。つまり、この”魔法”を使うと中に入っている文字をすべて大文字（Upper Case: アッパーケース）にした別の文字列を渡してくれるというものです。実際のコード例を見てください。

このように変数の入れ物は、中にあるデータに関する様々な情報を教えてくれるだけではなく、何らかの動作もしてくれます。「変数」はただモノではない入れ物だということが分かりましたか？

プロパティもメソッドもドットを付けてアクセスしますが、メソッドには必ず括弧が付いて、プロパティにはないという点に注意してください。

name.length  （括弧がないのでプロパティ）
name.toUpperCase() （括弧があるのでメソッド）

今すぐ書ける 1分間プログラミング