Javascript,jQuery

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

-Javascript,jQuery
-, , , ,