連番の付いたプロパティの内容を繰り返し処理で取得したい

Question

JavaScriptのプロパティ(オブジェクト)として以下の連番が振られたデータがあるときに、for文のような繰り返し処理を使ってまとめて内容を取得したいのですが、どのようにコードを書くことで実現できるでしょうか？

よろしくお願いいたします。

var test = {
  'koumoku_1': 'あああ',
  'koumoku_2': 'いいい',
  'koumoku_3': 'ううう'
}

for (var i = 0; i < test.length; i++) {
  console.log(test.koumoku_[i + 1]); // これではデータにアクセスできない
} 

// 現状、同じコードを連番分だけ複製させて処理させていますが、シンプルなコードを実現したいです
console.log(test.koumoku_1);
console.log(test.koumoku_2);
console.log(test.koumoku_3);

Answer 1

オブジェクトはfor-in構文でループ可能です.

var test = {
  'koumoku_1': 'あああ',
  'koumoku_2': 'いいい',
  'koumoku_3': 'ううう'
}
for (var i in test) {
  console.log(test[i]);
} 

NOTE:
Object.entriesメソッドと組み合わせるとfor-of構文が使えるようになります.

var test = {
  'koumoku_1': 'あああ',
  'koumoku_2': 'いいい',
  'koumoku_3': 'ううう'
}
for(var [key, val] of Object.entries(test)){
	console.log(val);
}

NOTE:
一般のオブジェクトにはlengthプロパティがありませんから, 普通のループ処理はできません. もしも数値部が連続しており, その範囲が判っているのであれば次のように記述することが可能です.

var test = {
  'koumoku_1': 'あああ',
  'koumoku_2': 'いいい',
  'koumoku_3': 'ううう'
}
var [begin, end] = [1, 3];
for (var i = begin; i <= end; i++) {
  console.log(test[`koumoku_${i}`]);
} 

Comments

[agepan]

ありがとうございます！
色々な方法をご教授頂きありがとうございます。これらの方法は今後もよく使えると思いますので勉強させていただきます！

Answer 2

var test = {
  'koumoku_1': 'あああ',
  'koumoku_2': 'いいい',
  'koumoku_3': 'ううう'
}

$.each(test,function(i,k){
  console.log(i+' : '+k);
});

簡単にまわしてみました。

Comments

[agepan]

ご回答ありがとうございます！
このような方法でも値を取得できるのですね。ありがとうございました。

Answer 3

今回の質問のケースの場合はobjectを列挙するかたちで問題なさそうですが、一応、ObjectとMapでは列挙のされ方に違いがあるので、両パターンを参考までに置いておきます。

Object

const obj = {
	[Symbol('symbol')]: 'symbol',
	koumoku: 'あああ',
	koumoku_1: '111',
	koumoku_2: '222',
	koumoku_3: '333',
	'3': 'さん'
}


for ( let key in obj) {
	console.log(obj[key])
}

// 以下ログの結果

// さん
// あああ
// 111
// 222
// 333

ポイント

• 挿入順に列挙される保証はない
• Symbolはfor inで列挙されない
• 1や"1"など数字っぽいkeyが'aaa'のような文字列より順序が優先される(言語仕様というより、これはモダンブラウザの実装による）

Map

const dic = new Map([
	[Symbol(), 'symbol'],
	['koumoku', 'あああ'],
	['koumoku_1', '111'],
	['koumoku_2', '222'],
	['koumoku_3', '333'],
	['3', 'さん']
])

// これでもOK
// console.log(...dic.values())

for (let [key, value] of dic) {
	console.log(value);
}

// 以下ログの結果

// symbol
// あああ
// 111
// 222
// 333
// さん

ポイント

• Symbolも列挙されるし、また、全て挿入順に列挙される

Comments

[agepan]

ご回答ありがとうございます。
オブジェクトに含まれるデータ(名前の統一性含め)が揃っていないようなときはご教授頂いた方法がとても役立ちそうです。勉強になりました！ありがとうございます！

Answer 4

すでに変数の連番についてはずばり回答が揃ったようなので
連番だけが目的ならこうする手もあるでしょう。

var test = {
  'koumoku':[
    'あああ',
    'いいい',
    'ううう',
    ],
};

for (var i = 0; i < test.koumoku.length; i++) {
  console.log(test.koumoku[i]);
} 
console.log(test.koumoku[0]);
console.log(test.koumoku[1]);
console.log(test.koumoku[2]);

※連番＝参照に順番をもたせたいなら配列で指定し、
連番の最初は1ではなく0が処理しやすい

蛇足

koumokuにつく数値が何から始まって何でおわるかわからなかったり
ゴミデータがあったりする場合も想定するとこう

var test = {
  'koumoku_102': 'いいい',
  'koumoku_103': 'ううう',
  'koumoku_101': 'あああ',
  'gomi': 'えええ',
}

var num=Object.keys(test).map(function(v){
  return (r=v.match(/koumoku_([0-9]+)/))?parseInt(r[1]):null;
}).filter(function(v){
  return v!==null;
}).sort();

for (var i = 0; i < num.length; i++) {
  console.log(test["koumoku_"+num[i]]);
} 

Comments

[agepan]

今回はデータの見やすさから連番指定ということになりましたが、配列だと処理しやすいというのが分かりますね。ご回答ありがとうございました！

Answer 5

for (var i = 0; i < test.length; i++)
{
    console.log(test["koumoku_" + (i + 1)]); // こんなんで行けたような遥かな記憶…
}

オブジェクトのプロパティアクセス

Comments

[agepan]

ご回答ありがとうございました。
こちらの方法で無事連番のプロパティ値を拾うことができました。
ありがとうございました！

Answer 6

これでいけませんでしょうか。

for (var i = 0; i < test.length; i++) {
  console.log(test["koumoku_" + (i + 1)]); 
} 

Comments

[退会済みユーザー]

スミ括弧の数が合っていないようななな

[akabee]

そうですね。修正します。luckerさんの回答と同じ結果になると思います。

[退会済みユーザー]

うふふふふ。

[agepan]

ありがとうございました。
こちらと同様のコードにて処理させることができました！