— javascript, tutorials — 1 min read
前回は if / 制御構文 をやりました。
前回: JavaScript道場:八日目 / 制御構文 if
複数の要素の集合を格納管理するリスト構造。変数は基本的に数値か文字か真偽値などのデータを一つしか保存できませんでしたが、配列は複数の値を格納できます。 オブジェクトは key:value 形式ですが、配列は順番(index)で要素を指定して取り出します。 配列データはオブジェクト(Arrayオブジェクト)なので、プロパティを持っています。
「順序付きのデータ」と考えてください。配列は複数のデータが「順番に」入ってるオブジェクトです。
オブジェクトにはkey
とvalue
のペアでデータが入っていました。オブジェクトから特定の値を取り出したい場合はkeyを指定していました。
1// オブジェクトの場合2var obj = { name: "松田信介", age: 34 }3obj.name // 松田信介4obj.age // 34
配列は番号で指定します。 配列の要素は0からカウントします。
1// 配列の場合2var arr = [81, 22, 37, 40]3arr[0] // 0番目のデータ => 814arr[1] // 1番目のデータ => 22
データに名前をつけたいときは、オブジェクト データの順番に注意を払う時は、配列
注:これから説明することは暗記する必要はありません。わからなければMDNを見ればよいです。概念を理解することが一番重要です。 これはプログラミングの学習全般に言えます。
配列の宣言は、 []
でくくり、複数データがある場合はカンマで区切る
1var fruits = ["りんご", "バナナ"];2console.log(fruits.length);
配列の要素を取得する(index)
index(添字)を使って、取り出すデータを指定することができます
1var fruits = ["りんご", "バナナ"];2var first = fruits[0];3var last = fruits[fruits.length - 1];
配列の長さを取得する(length)
This is a header.
- This is the first list item.
- This is the second list item.
Here's some example code:
1```js2console.log(fruits.length);3```
配列に要素を追加する(push)
Here's some example code:
1fruits.push("みかん");2console.log(fruits)3// ["りんご", "バナナ", "みかん"]
配列の最後の要素を取り出す(pop)
1var arr = [1, 2, 3, 4, 5]2console.log(arr.pop()) // 53arr // [1, 2, 3, 4]
配列の話は一旦これが最低限です。
1var num1 = 1002var num2 = 1103var num3 = 1204var num4 = 1305// 書き換え6var numbers = [100, 110, 120, 130, 140]
とだけ、まずは覚えておきましょう。
変数は「データを格納する箱」という説明をしたと思いますが、これは正確な表現ではありません。 変数をちゃんと理解するには、メモリについて理解する必要があります。
メモリは ビットデータ(0 or 1) を保持することができるコンピュータの部品です。主記憶装置(メインメモリ)と呼ばれます。 メモリが大きければ大きいほど効率よく作業できるので、よく作業机に例えられます。(机が広ければ沢山の本を開いたり文房具を置いたりできる)
メモリ空間(bitがコンピュータの中でどういう風に管理されているか)をイメージできなければ、必ずプログラミングの学習でつまづきます。 逆にメモリが理解できれば、今後のプログラミング学習がグンと捗ります!なので、メモリについてイメージを持っていただくたいと思ってこのコラムを差し込みました。
変数を宣言して値を格納した時、変数は実際のところ、コンピュータのどこに保存されているでしょうか? 答えはメインメモリ(主記憶装置)です。この部品は、スマホやPCなどには必ず入っています。
a
にHELLO
という文字を格納した時1var message = "HELLO" // 変数 messageを宣言しHELLOという文字列を格納
→ コンピュータのメモリの一部に「message」という名前をつけ、そのメモリに「HELLO」というデータを格納した
→ 文字が入るメモリ領域(8bit)を5つ確保し、先頭に「H」2番目に「E」3番目に「L」4番目に「L」5番目に「0」という文字を格納した。文字の配列(文字列)としてアクセスできるように「message」という名前をそのメモリ領域につけた。
1var message = "HELLO"2message[0] // H 配列は0からカウントする3message[1] // E4message[2] // L5message[3] // L6message[4] // O
1"HELLO".length // 5
上記コード結果をみてわかる様に、文字を格納するデータ型があつまったものが「文字列」。 例えば「HELLO」がメモリに格納されているイメージが上記の画像です。(実際とは少し違いますが、こういう風にイメージしておいてください)
1for (初期条件; 処理を続行する条件; 処理が終わった後に実行する) {2 繰り返し実行したい処理3}
1var message = "HELLO" // 配列オブジェクト2for (var n = 0; n < message.length; n++) {3 console.log(message[n])4}
for()
繰り返しのキーワードvar n = 0;
変数 n を 初期値 0 で宣言n < message.length;
変数 n が message.length より小さい時に、処理を続けるn++
変数 n を 足す1 する。繰り返し処理が一回実行された後に実行される。console.log(message[n])
変数 n が message.length より小さい時に実行される。1for(var i=0;i<5;i++) { console.log(i) }
改行してもしなくてもOK
1for(var i=0;i<5;i++) {2 console.log(i)3}
1for(var i=0;i<5;i++)2{3 console.log(i)4}
全て問題なく動作する
1for (var i=0;i<5;i++) {}2for(var i=0;i<5;i++){}3for( var i=0; i<5; i++ ) {}
for のループが今何番目かをカウントするための変数のことです。
下記のコードでは num
がカウンタ変数と呼ばれたりします。
普通の変数との違いは特にありません。forの中でカウンタとして使われる変数をそう呼ぶことがあるだけで、特別な変数ではありません。
1for(var num = 0; num < 5; num++){2 // statement3}
下記を読んで不明な単語があれば質問してくださいね!