配列
複数の値をまとめて扱うときには配列を用いる。
配列
- 宣言・初期化
-
- const 配列名 = new Array();
- const 配列名 = [配列の中身1,配列の中身2,…]
- const 配列名 = [];
配列名[インデックス] = 値1;
配列名[インデックス] = 値2;
- 配列自体(入れ物)
- 配列名
- 配列の中の入れ物
- 配列名[インデックス]
- 一度に初期化する
-
const members = new Array('高橋','新垣');
document.write (members[0]); //高橋が出力
A | B | C | D | |
---|---|---|---|---|
1 | nums | 出力 | ||
2 | 5 | =nums | ||
3 | 2 | |||
4 | 3 | |||
5 | 4 | |||
6 | 2 | |||
7 | 6 | |||
8 | 7 | |||
9 |
この例では7つの値を1つの変数numsで扱える。
0 | 1 | 2 | 3 | 4 | 5 | 6 |
---|---|---|---|---|---|---|
A2 5 | A3 2 | A4 3 | A5 4 | A6 2 | A7 6 | A8 7 |
配列要素には0から連番が振られる。たとえば前から4番目の値を指示したいときにはnums[3]とする。
- 配列の初期化…const 配列名 = [配列の中身1,配列の中身2,…]
- 配列の箱の数(長さ)は配列名.lengthで取得できる。
- htmlテンプレート
<script>
const nums = [5, 2, 3, 4, 2, 6, 7];
document.write('出力:');
for(let i = 0; i < nums.length; i++){
document.write('[' + i + ':' + nums[i] + ']');
}
</script>
- 配列はconstで定義しても、中身は入れ替えることができる。
<script>
nums[3] = 10000;
document.write('出力:');
for(let i = 0; i < nums.length; i++){
document.write('[' + i + ':' + nums[i] + ']');
}
</script>
課題:配列の反転
- 実習用ファイル
- input_elements
-
A2:A8…<input name="rev">
document.getElementsByName('rev')
- elements
- input_elementsの値配列
const elements = []; const input_elements = document.getElementsByName('rev'); for(let i=0;i<input_elements.length; i++){ if(input_elements[i].value!=""){ elements[i]=input_elements[i].value; } }
ダウンロードしたhtmlファイルの「//配列が反転する用にプログラムを記せ。」の後に得られた配列が反転されるように足りないコードを記せ。
0 | 1 | 2 | 3 | 4 | 5 | 6 | 7 |
---|---|---|---|---|---|---|---|
a | b | c | d | e | f | g | h |
- アルゴリズム
-
- elements[0]とelements[配列の最後]を交換する
- elements[1]とelements[配列の最後 - 1]を交換する
- elements[2]とelements[配列の最後 - 2]を交換する
- elements[3]とelements[配列の最後 - 3]を交換する
ただし実際にはループを回して実行する。
- elements[ i ]とelements[配列の最後 - i ]を交換する
- 値の交換
-
- 2つの箱(変数)は詰まっている
a 値1 b 値2 - 空の箱(tmp)を用意する
tmp 空 a 値1 b 値2 - 箱tmpに箱aの中身(値1)を詰める。
tmp 値1 a 値1 b 値2 - 箱aに箱bの中身(値2)を詰める。
tmp 値1 a 値2 b 値2 - 箱bに箱tmpの中身(値1)を詰める。
a 値2 b 値1 tmp 値1 - 箱aと箱bの中身が入れ替わった。
a 値2 b 値1
- 2つの箱(変数)は詰まっている
課題:ミーティング
- 実習用ファイル
ミーティングの予定を立てたい。そこで予定表に出席可能な日に「○」を付けることにした。ミーティング開催可能な日に「可」と表示されるようにせよ。
- ミーティング開催条件
-
- 部長が出席し、それ以外に出席可能である人が2人以上いること
- 部長がいない場合、4人以上出席者がいること
- input_elements
-
C2:C10…<select name="yes"></select>
document.getElementsByName('yes')
const input_elements = document.getElementsByName('yes');
- 部長の出欠manager
-
- = parseInt(input_elements[1].value);
- それ以外の部員出席者数members
-
- = parseInt(input_elements[0].value);
- += parseInt(input_elements[2].value);
- += parseInt(input_elements[3].value);
- …
- 出席…1,欠席…0
- parseInt(char_num)…文字を数値に変換する(cf.ExcelのVALUE関数)
連想配列のようなもの
- インデックスを文字列
-
const 配列名 = new Object();
あるいは
const 配列名 = {};
- 配列名[インデックス] = 値1;
- 配列名.インデックス = 値2;
※membersの「leader」箱に「高橋」を代入
- 一度に初期化する
- members = {leader: '高橋',subleader : '新垣'};
- 値の取り出し
- document.write (members[leader]);
配列をすべて取り出す
- 配列の取り出し
- 連想配列の取り出し