@ JavaScript

array:配列

配列は複数の変数の値に順序を付けてまとめて扱う方法です。この値を配列の要素と呼びます。何番目の値か識別するための番号を「インデックス」といいます。インデックスは 1 ではなく 0 から始まります。

JavaScript は型のない言語なので、どの型の値でも格納することができます。

ある配列の要素に他の配列を格納することも可能です。

配列を作成する

配列を作る方法はいくつかありますが、一番簡単な形は [] を使う方法です。

example.js

var list = ['html','css','JavaScriot'];

他にも Array() を使う方法、new を使う方法があります。

example.js

var list = Array('html','css','JavaScript');
var list = new Array('html','css','JavaScript');

配列の要素を取得する

配列内のデータにアクセスするには [] を使ってインデックスで指定します。

example.js

var list = Array('html','css','JavaScript');
var first = list[0];

array_01.html

<!DOCTYPE html>
<html lang="ja">

<head>
<meta charset="utf-8">
<title>sample</title>
<script>
var list = Array('html','css','JavaScript');
var first = list[0];

alert(first);
</script>
</head>

<body>
</body>

</html>

配列に要素を追加する

まだ存在しないインデックスに値を代入することで、配列に要素を追加することができます。

example.js

var list = Array('html','css','JavaScript');
list[3] = 'PHP'; 

配列のループ処理

example.js

var list = Array('html','css','JavaScript');

list.forEach(function (item, index, array) {
  document.write(item, index + "<br>");
});

連想配列

添え字に文字列を使った配列を連想配列といいます。

array_02

// 連想配列
var list = {
  'Linux': 'Red Hat',
  'Windows': 'Windows10',
  'Macintosh': 'Sierra'
};

console.log(list.length); // undefined
console.log(list["Linux"]); // Red Hat
console.log(list["Windows"]); // Windows10
console.log(list.Windows); // Windows10

多次元連想配列

配列の中に配列を定義したものを多次元配列と呼びます。

array_03

// 多次元連想配列
var list = {
  'Linux': {
    'Red Hat': '100',
    'Debian': '150',
    'Slackware': '200'
  },
  'Windows': {
    'WinXP': '500',
    'Win8': {
      'Win80': '600',
      'Win81': '700'
    }
  }
};

console.log(list.length); // undefined
console.log(list["Linux"]); // Object { Red Hat: "100", Debian: "150", Slackware: "200" }
console.log(list['Linux']['Red Hat']); //100
console.log(list['Windows']['Win8']); // Object { Win80: "600", Win81: "700" }
console.log(list.Windows.Win8.Win80); //600