Edited at

JavaScriptにおける連想配列のforループ操作


概要

変数を連想配列に入れるのが大好きで、使用頻度がめちゃくちゃ高い割に毎回忘れる連想配列のforループ操作。


連想配列のkey-valueを順番に取得する

var hash = {

key0: "value0",
key1: "value1"
};

for (key in hash) {
alert('key:' + key + ' value:' + hash[key]);
}


追記: コメント欄より

このエントリは上記の短い記述に対し、本当にやりたかったことを汲んだ知見が寄せられ大変勉強になりました。このエントリを参照するエントリもじわじわ増えており、(実である)コメント欄がスルーされてしまうのは勿体ないのでコメント欄の内容を再掲?します(2019.06.20)

このエントリに連想配列の値参照・操作の方法を求めて辿り着いた方は是非コメント欄に目を通してください。

Consoleにコピペすればすぐ実行結果を確認できるよう、動作確認用の変数宣言を残し、出力形式をconsole.log()に変更しています。

誤り・もっと良い記述がありましたら編集リクエストを送るかコメント欄までお願いします。


map()を使う

@yoichiro6642 さんのコメントより、map()を使う方法

{

var hash = {
key0: "value0", key1: "value1"
};

Object.keys(hash).map(key => console.log('key:' + key + ' value:' + hash[key]));
// [undefined, undefined]が出てしまうが内容を確認したいだけなら十分
}


forEach()を使う

↑を受けた @le_panda_noir さんのコメントよりforEach()を使う方法

{

var hash = {
key0: "value0", key1: "value1"
};

Object.keys(hash).forEach(key => console.log('key:' + key + ' value:' + hash[key]));
}


Map.prototype.forEach()を使う

@think49 さんのコメントよりMap.prototype.forEach()を使う方法

Map.prototype.forEach() - JavaScript | MDN

{

var map = new Map([['key0', 'value0'], ['key1', 'value1']]);

map.forEach(function (value, key) {
console.log('key:' + key + ' value:' + value);
});
}


Object.entries()を使う

@hikaru_oao さんのコメントよりObject.entries()を使う方法

{

var hash = {
key0: "value0", key1: "value1"
};

for (let [key, value] of Object.entries(hash)) {
console.log('key:' + key + ' value:' + value);
}
}