var 配列名 = [値1, 値2, 値3];
（変数名）         0    1   2  ← インデックス番号（部屋番号）

配列名[インデックス番号]
　　　　　　　添字

配列を使ってみよう。

1. 「chapter05」 ›「array」フォルダ内の「app.js」をテキストエディタで開く
2. membersという配列を作成

// 配列の作成
var members = ['指原', '山本', '柏木', '横山'];

3. members配列のインデックス番号が「1」のデータを出力

// 配列の作成
var members = ['指原', '山本', '柏木', '横山'];

// 配列の値にアクセス
console.log(members[1]); // 山本

4. 上書き保存
5. ブラウザで「chapter05」 ›「array」フォルダ内の「index.html」をブラウザで開く

反復を使って全ての値を
取り出してみよう。

配列は反復を活用することで、全ての値を効率よく取り出せる。

1. 「chapter05」 ›「array」フォルダ内の「app.js」をテキストエディタで開く
2. for文を使って配列の全要素を出力

// 配列の作成
var members = ['指原', '山本', '柏木', '横山'];

// 配列の値にアクセス
console.log(members[1]); // 山本

// 反復を活用して全ての値を取り出す
for(var i = 0; i < 4; i++) {
  document.write('<p>' + members[i] + '</p>');
}

3. 上書き保存
4. ブラウザで「chapter05」 ›「array」フォルダ内の「index.html」をブラウザで開く

値の変更をしてみよう。

配列の各要素は、変数の様に扱える。
また、インデックス番号を指定しない場合は、配列の末尾に値が追加される

配列名[インデックス番号] = 値;

1. 「chapter05」 ›「array」フォルダ内の「app.js」をテキストエディタで開く
2. 「反復を活用して全ての値を取り出す」処理の前で、配列内のデータの変更や、配列にデータを追加を行う

// 配列の作成
var members = ['指原', '山本', '柏木', '横山'];

// 配列の値にアクセス
console.log(members[1]); // 山本

// 配列の値を変更
members[1] = 'まゆゆ'; // members の 1号室に値を代入

// 反復を活用して全ての値を取り出す
for (var i = 0; i < 4; i++) {
  document.write('<p>' + members[i] + '</p>');
}

3. 「反復を活用して全ての値を取り出す」処理のループの終了条件を members.lengthに変更

配列名.length

// 配列の作成
var members = ['指原', '山本', '柏木', '横山'];

// 配列の値にアクセス
console.log(members[1]); // 山本

// 配列の値を変更
members[1] = 'まゆゆ'; // members の 1号室に値を代入

// 反復を活用して全ての値を取り出す
for (var i = 0; i < members.length; i++) {
  document.write('<p>' + members[i] + '</p>');
}

4. 上書き保存
5. ブラウザで「chapter05」 ›「array」フォルダ内の「index.html」をブラウザで開く

var 配列名 = {
  キー1: 値1,
  キー2: 値2,
  キー3: 値3
};

配列名[キー]
// または
配列名.キー

連想配列（オブジェクト）を使ってみよう。

1. 「chapter05」 ›「object」フォルダ内の「app.js」をテキストエディタで開く
2. 連想配列を作成

// オブジェクトの作成
var character = {
  name: '山田',
  age: 30,
  job: 'ゆうしゃ'
};

3. 連想配列の各要素を出力

// オブジェクトの作成
var character = {
  name: '山田',
  age: 30,
  job: 'ゆうしゃ'
};

// オブジェクトの出力
document.write('<p>俺は' + character['job'] + 'の' + character['name'] + 'だ！</p>');
document.write('<p>年齢は' + character.age + '歳だ！</p>');

4. 上書き保存
5. ブラウザで「chapter05」 ›「object」フォルダ内の「index.html」をブラウザで開く

値の変更をしてみよう。

連想配列も配列と同様で、各要素の値を変更したり、追加することができる。

配列名[キー] = 値;

1. 「chapter05」 ›「object」フォルダ内の「app.js」をテキストエディタで開く
2. 入力ダイアログで受け取った名前に変更する

// オブジェクトの作成
var character = {
  name: '山田',
  age: 30,
  job: 'ゆうしゃ'
};

// 値の変更
character['name'] = prompt('名前を設定して下さい。');

// オブジェクトの出力
document.write('<p>俺は' + character['job'] + 'の' + character['name'] + 'だ！</p>');
document.write('<p>年齢は' + character.age + '歳だ！</p>');

3. 上書き保存
4. ブラウザで「chapter05」 ›「object」フォルダ内の「index.html」をブラウザで開く

var 変数名 = new Date();

Dateオブジェクトを使ってみよう。

1. 「chapter05」 ›「date」フォルダ内の「app.js」をテキストエディタで開く
2. 現在の日時を取得

// 現在日時のオブジェクトをインスタンス化
var now = new Date();
console.log(now);

3. 上書き保存
4. ブラウザで「chapter05」 ›「date」フォルダ内の「index.html」をブラウザで開く

Dateオブジェクトの
メソッドを使ってみる

1. 「chapter05」 ›「date」フォルダ内の「app.js」をテキストエディタで開く
2. 現在の日付や時間を取り出す

// 現在日時のオブジェクトをインスタンス化
var now = new Date();
console.log(now);

// Dateオブジェクトのメソッド
var year = now.getFullYear();
var month = now.getMonth() + 1;
var date = now.getDate();
var hour = now.getHours();
var minute = now.getMinutes();
var seconds = now.getSeconds();

document.write(year + '年' + month + '月' + date + '日 ' + hour + '時' + minute + '分' + seconds + '秒');

3. 上書き保存
4. ブラウザで「chapter05」 ›「object」フォルダ内の「index.html」をブラウザで開く

• 添字がインデックス番号の配列を、通常の配列と言う。
• 添字がキーの配列を、連想配列 （オブジェクト）と言う。
• 配列や連想配列の全要素を取り出すには、ループを使う。