情報処理実習3B(Web)

2017年度 前期 木04 15:15-16:45 瀬田2-119

配列

配列

宣言・初期化
var 配列名 = new Array();
あるいは
var 配列名 = [];
配列名[インデックス] = 値1;
配列名[インデックス] = 値2;
var members = new Array();
members[0] = '高橋' //membersの0番（最初）に「高橋」を代入
document.write (members[0]); //「高橋」が出力
配列自体（入れ物)
配列名
配列の中の入れ物
配列名[インデックス]
一度に初期化する
var members = new Array('高橋','新垣');
document.write (members[0]); //高橋が出力
array1.html
<!DOCTYPE html>
<html lang="ja">
<head>
   <meta charset="UTF-8" />
   <title>配列1</title>
<script>
var groups = new Array('モーニング娘。','Berryz工房','℃-ute','真野恵里菜','スマイレージ');
var members = new Array();
// var members = [];でもよい

members[0] = '藤本';
members[1] = '高橋';
members[2] = '新垣';
members[3] = '亀井';
members[4] = '道重';
members[5] = '田中';
members[6] = '久住';
members[7] = '李';
members[8] = '銭';
</script>
</head>
<body>
<h1>配列1</h1>
<dl>
<dt>グループ</dt>
<dd>
<ul>
<script>
//配列groupsの取り出し
document.write ("<li>"+groups[0]+"</li>");
document.write ("<li>"+groups[2]+"</li>");
</script>
</ul>
</dd>
<dt>メンバー</dt>
<dd>
<ul>
<script>
document.write ("<li>"+members[5]+"</li>");
</script>
</ul>
</dd>
</dl>
</body>
</html>

連想配列のようなもの

インデックスを文字列
var 配列名 = new Object();
あるいは
var 配列名 = {};
配列名[インデックス] = 値1;
配列名.インデックス = 値2;
var members = new Object();
members[leader] = '高橋''
members.center = '高橋';

※membersの「leader」箱に「高橋」を代入

一度に初期化する
members = {leader: '高橋',subleader : '新垣'};
値の取り出し
document.write (members[leader]);
array2.html
<!DOCTYPE html>
<html lang="ja">
<head>
   <meta charset="UTF-8" />
   <title>いわゆる連想配列</title>
   <script>
const groups = {'モ' : 'モーニング娘。', 'ベ' : 'Berryz工房', 'キ' : '℃-ute',
 'マ' : '真野恵里菜', 'ス' : 'スマイレージ'};
const members = new Object();
//const members = {};でもよい。
members['leader'] = '飯田';
members.center = '安倍';
   </script>
</head>
<body>
<h1>いわゆる連想配列</h1>
<dl>
<script>
    document.write(groups['ス'] + '<br>');
    document.write(groups.モ + '<br>');
    document.write(members['leader'] + '<br>');
    document.write(members.center);
</script>
</dl>
</ul>
</body>
</html>

配列をすべて取り出す

配列の取り出し
var members = new Array('高橋','新垣');
for(var i = 0; i < members.length; i++){
    document.write(members[i]);
}
var members = new Array('高橋','新垣');
for(var index in members){
    document.write(members[index]);
}
連想配列の取り出し
var members = {leader: '高橋',subleader : '新垣'};
for(var index in members){
    document.write(members[index]);
}
array3.html
<!DOCTYPE html>
<html lang="ja">
<head>
   <meta charset="UTF-8" />
   <title>配列取り出し</title>
<script>
const members = new Array();

members[0] = '藤本';
members[1] = '高橋';
members[2] = '新垣';
members[3] = '亀井';
members[4] = '道重';
members[5] = '田中';
members[6] = '久住';
members[7] = '李';
members[8] = '銭';

const groups = {モ : 'モーニング娘。', ベ : 'Berryz工房', キ : '℃-ute', マ : '真野恵里菜', ス : 'スマイレージ'};
</script>
</head>
<body>
<h1>配列取り出し</h1>
<ul>
<script>
//配列groupsの取り出し
for(let i = 0; i < members.length; i++){
    document.write ("<li>"+members[i]+"</li>");
}
</script>
</ul>
<dl>
<script>
//連想配列groupsの取り出し
for(let index in groups){
    document.write ("<dt>" + index + "</dt>");
    document.write ("<dd>" + groups[index] + "</dd>");
}
</script>
</dl>
</body>
</html>