トップへ(mam-mam.net/)

Javascriptの配列、連想配列の使い方解説

検索:

■配列の生成

配列変数生成と同時に値を代入する

//配列(Array)変数の生成と値の代入
let arr=[1,2,"3です"];

//配列をコンソールへ表示([1,2,"3です"]がコンソールに表示される)
console.log(arr);

//配列の添え字0をコンソールへ表示(1 がコンソールに表示される)
console.log(arr[0]);

//forEachで配列の各値をコンソールへ表示
arr.forEach(function(val){
  console.log(val);
});

配列変数生成と値の代入

//配列(Array)変数の生成
let arr=[];  //let arr=new Array(); でも同じ

//配列に値を代入
arr[0]="0だ";
arr[1]=1;
arr[1]=24;//値の変更
arr.push(231);//最大添え字+1に値を代入。arr[arr.length]=231;と同じ
arr.unshift("先頭");//配列の先頭に値を挿入

//配列をコンソールへ表示(["先頭","0だ",24,231]がコンソールに表示される)
console.log(arr);

//forEachで配列の各値をコンソールへ表示
arr.forEach(function(val){
  console.log(val);
});

■連想配列の生成

連想配列変数生成と同時に値を代入する

//連想配列変数の生成と値の代入
let arr={id:1, name:"ジェーン"};

//連想配列をコンソールへ表示({id:1, name:"ジェーン"}がコンソールに表示される)
console.log(arr);

//連想配列のキー「name」の値を表示("ジェーン" がコンソールに表示される)
console.log(arr["name"]);

//連想配列のキー「name」の値を表示("ジェーン" がコンソールに表示される)
console.log(arr.name);

//連想配列から「キーのみの配列」変数を作成
keys=Object.keys(arr);  //keys=["id","name"]になる

//連想配列はforEachが使えない為、
//「キーのみの配列」をforEachで回し、連想配列の各値をコンソールへ表示
keys.forEach(function(key){
  console.log(key+":"+arr[key]);
});

連想配列変数生成と値の代入

//連想配列変数の生成
let arr={};

//連想配列に値を代入
arr["id"]=0;
arr.name="ジェーン";

//連想配列の値を変更
arr["id"]=1;
arr["name"]="マイク";

//連想配列をコンソールへ表示({id:1, name:"マイク"}がコンソールに表示される)
console.log(arr);

//連想配列から「値のみの配列」を生成する(IE不可)
let values=Object.values(arr);  //values=[1,"マイク"]になる

//「値のみの配列」をコンソールへ表示([1,"マイク"]がコンソールに表示される)
console.log(values);

配列と連想配列

■配列の連想配列の一部配列

//配列連想配列の一部配列変数を生成し値を代入
let arr=[{title:"タイトル11",data:[0,1,2]},{title:"タイトル12",data:[0,10,20]}];

console.log(arr[1]["data"][1]);//10 がコンソールに表示される

console.log(arr[1].data[1]);//10 がコンソールに表示される