多次元配列のkeyをカウントUPしながら取得したい

質問

お世話になります。

for文をその分記述すれば、得たい値は取得できるのですが、スマートではない為、多次元配列のkeyをカウントアップしながら取得できれば・・・と、ハマってます。

どのように記述すれば可能でしょうか。

callback({
"IMG" : [
{
"src" : {
"url1" : "http://domain.com/",
"url2" : "http://domain.com/",
"url3" : "http://domain.com/"
}
},
{
"src" : {
"url1" : "http://domain.com/",
"url2" : "http://domain.com/",
"url3" : "http://domain.com/"
}
},
{
"src" : {
"url1" : "http://domain.com/",
"url2" : "http://domain.com/",
"url3" : "http://domain.com/"
}
}
]
}
);

$(function(){
$.ajax({
type: 'GET',
url: './jsonp.js?callback=?',
dataType: 'jsonp',
jsonpCallback: 'callback',
success: function(data){
str = $('<ul id="tiles"></ul>');

/*下記のやり方で取得可能ですが、物凄く冗長な為、簡素に記述したいのです
for (var i in data.IMG) {
var imgsrc = data.IMG[i].src.url1;
alert( "imgsrc="+imgsrc );
}
for (var i in data.IMG) {
var imgsrc = data.IMG[i].src.url2;
alert( "imgsrc="+imgsrc );
}
for (var i in data.IMG) {
var imgsrc = data.IMG[i].src.url3;
alert( "imgsrc="+imgsrc );
}
*/
var ary=new Array(1,2,3);
for(n in ary) {
for (var i in data.IMG) {
var url = 'url'+n;
var imgsrc = data.IMG[i].src.url;
alert( "url="+url );
}
}
});
});

どなた様かご教授戴けますようお願い致します。

回答No.1

anmochi · ベストアンサー

eval使うとか・・・・。

/*下記のやり方で取得可能ですが、物凄く冗長な為、簡素に記述したいのです
for (var i in data.IMG) {
var imgsrc = data.IMG[i].src.url1;
alert( "imgsrc="+imgsrc );
}
for (var i in data.IMG) {
var imgsrc = data.IMG[i].src.url2;
alert( "imgsrc="+imgsrc );
}
for (var i in data.IMG) {
var imgsrc = data.IMG[i].src.url3;
alert( "imgsrc="+imgsrc );
}
*/
↓
for (var i in data.IMG) {
for (var j = 1; j <= 3; j++) {
var imgsrc = eval("data.IMG[i].src.url" + j);
alert( "imgsrc="+imgsrc );
}
}

試してないけど。

お礼

ばっちりいけました。
evalでできるんですね。勉強になりました。
ありがとうございます。

回答No.3

Ogre7077

少々難解になりますが、関数型プログラミングっぽい記述は如何でしょう

function getUrl(pname){ return function(img){return img.src[pname]} }
function process(url){ alert('imgsrc=' + url); }

// IMG の配列 → 特定プロパティ値の配列 → 配列内容で繰り返し処理
data.IMG.map(getUrl('url1')).forEach(process);
data.IMG.map(getUrl('url2')).forEach(process);
data.IMG.map(getUrl('url3')).forEach(process);

お礼

関数型っぽい記述の事例ありがとうございます。

記述を良く良くみて調べてみますと、
map演算子で配列を操作するforEachに関数を渡す。
という感じなんですかね。。

IMGのsrc以外に受け取りたい値が２つの場合、３つの場合、と増えていった際、受け渡しの記述が大変になりました。そして得たい値が表示できない。というエラーになり、今回はひとまず深追いしないでおきます。

また一つ視野が広がりました。ご教授頂きありがとうございます。

また何か機会ありましたら宜しくお願い致します。

回答No.2

Gotthold

var ary=["url1","url2","url3"];
for(j in ary) {
　for (var i in data.IMG) {
　　var imgsrc = data.IMG[i].src[ ary[j] ];
　　alert( "url="+ary[j] );
　}
}

こんな感じ。

JavaScriptはオブジェクトのプロパティアクセスを連想配列で実現していて
obj.prop と obj["prop"] は同じです。
（後者なら"prop"は変数でも良い。）

お礼

obj.propとobj["prop"]が同じで、後者は中を変数でもOKという事。
事例を交えて教えて頂きありがとうございます。

複数の値を取得する際も予め配列として設定しておくことで同じように取得することも確認できました。

勉強になりました。ありがとうございます。