
Javascriptでの配列の作成方法
2018/10/03
いつもPHPを触っており、たまにJavascriptを使うと配列の作り方がぐっちゃぐちゃになってきたので整理。
とりあえずメモ程度に。
Javascriptで配列
配列 その1
配列オブジェクトを作成し、後に値をセットする。
あらかじめ配列の要素数を指定する方法。
[js]
// 書式:
配列名 = new Array(要素数);
// 例:
operation_system = new Array(3)
operation_system[0] = "Windows";
operation_system[1] = "MacOS";
operation_system[2] = "Linux";
// アクセス方法:
console.log(operation_system[0]); // 実行結果:Windows
[/js]
配列 その2
配列オブジェクトを作成する際に値をセット。
要素数の指定を省略した場合は、自動的に要素の数に合わせて配列の大きさが変化する。
[js]
// 書式:
配列名 = new Array("値1","値2","値3",…,"値n");
// 例:
operation_system = new Array("Windows","MacOS","Linux");
// アクセス方法:
console.log(operation_system[1]); // 実行結果:MacOS
[/js]
配列 その3
Arrayオブジェクトの生成を省略する方法。
"[]"を使う場合は、配列を直接作成できる。
[js]
// 書式:
配列名 = ["値1","値2","値3",…,"値n"];
// 例:
operation_system = ["Windows","MacOS","Linux"];
// アクセス方法:
console.log(operation_system[2]); // 実行結果:Linux
[/js]
連想配列
連想配列 その1
配列オブジェクトを宣言、生成し、後に値を作成。
[js]
// 書式:
配列名 = new Array();
配列名["キー"] = "値";
// 例:
person = new Array();
person["name"] = "山田太郎";
person["birthday"] = "1985/11/2";
person["gendr"] = "male";
// アクセス方法:
console.log(person["name"]); // 実行結果:山田太郎
[/js]
連想配列 その2
配列オブジェクトを作成する際に値をセット。
個人的に、改行した方が見やすくて好き。
[js]
// 書式:
配列名 = {
"キー1":"値1",
"キー2":"値2",
"キー3":"値3"
}
// 例:
person = {
"name":"佐藤恵子",
"birthday":"1995/10/2",
"gendr":"female"
}
// アクセス方法:
console.log(person["birthday"]); // 実行結果:1995/10/2
[/js]
連想配列 その3
[js]
// 書式:
配列名 = new Object();
配列名.キー1 = "値1";
配列名.キー2 = "値2";
// 例:
person = new Object();
person.name = "山田太郎";
person.birthday = "1985/11/2";
person.gender = "male";
// アクセス方法:
console.log(person.name); // 実行結果:山田太郎
[/js]
多次元配列
二次元配列
[js]
// 書式:
var aryA = ["値A1", "値A2", "値A3"];
var aryB = ["値B1", "値B2", "値B3"];
var aryC = ["値C1", "値C2", "値C3"];
var data = [aryA, aryB, aryC];
// 以下でも同じ
二次元配列 = [
["値A1", "値A2", "値A3"],
["値B1", "値B2", "値B3"],
["値C1", "値C2", "値C3"]
];
// 例:
var data = [
[58, 45, 32],
[98, 75, 12],
[68, 15, 92]
];
// アクセス:
console.log(data[1][2]); // 実行結果:12
[/js]
二次元配列(連想配列)
[js]
// 書式:
二次元配列 = {
"a" : ["値A1", "値A2", "値A3"],
"b" : ["値B1", "値B2", "値B3"],
"c" : ["値C1", "値C2", "値C3"]
}
// 例:
data = {
"a" : [58, 45, 32],
"b" : [98, 75, 12],
"c" : [68, 15, 92]
}
// アクセス:
console.log(data["a"][1]); // 実行結果:45
[/js]
"[]" と "{}" の使い方を理解(区別)できれば、混乱は少なそうな気がします。
ただ、慣れてないとやっぱり混乱するw