Underscore.js 재 구조는 내가 underscore.js을 사용하고

Question

값을 기준으로 객체는 물론 모든 솔루션은 괜찮지 만, 나는이처럼 보이는 물체가 :

이

{ '4f871d4967e04': 
    [ { _id: 4f871d4adaf6fa492f000001, 
     product_id: 4f871d43daf6fa4e2f000002, 
     width: '300', 
     height: 300, 
     group: '4f871d4967e04' }, 
    { _id: 4f871d4adaf6fa492f000004, 
     product_id: 4f871d43daf6fa4e2f000002, 
     width: '150', 
     height: 150, 
     group: '4f871d4967e04' }, 
    { _id: 4f871d4bdaf6fa492f000007, 
     product_id: 4f871d43daf6fa4e2f000002, 
     width: '100', 
     height: 100, 
     group: '4f871d4967e04' }, 
    { _id: 4f871d4bdaf6fa492f00000a, 
     product_id: 4f871d43daf6fa4e2f000002, 
     width: '75', 
     height: 75, 
     group: '4f871d4967e04' } ], 
    '4f871d51200de': 
    [ { _id: 4f871d51daf6faf42e000001, 
     product_id: 4f871d43daf6fa4e2f000002, 
     width: '300', 
     height: 300, 
     group: '4f871d51200de' }, 
    { _id: 4f871d52daf6faf42e000004, 
     product_id: 4f871d43daf6fa4e2f000002, 
     width: '150', 
     height: 150, 
     group: '4f871d51200de' }, 
    { _id: 4f871d53daf6faf42e000007, 
     product_id: 4f871d43daf6fa4e2f000002, 
     width: '100', 
     height: 100, 
     group: '4f871d51200de' }, 
    { _id: 4f871d53daf6faf42e00000a, 
     product_id: 4f871d43daf6fa4e2f000002, 
     width: '75', 
     height: 75, 
     group: '4f871d51200de' } ] } 

내가 좋아하는 것을 이에 전원을 켭니다 :

{"4f871d4967e04" : { 
"300" : { 
    _id : '', 
    } 
"150" : { 
    _id : '', 
    } 
"100" : { 
    _id : '', 
    } 
"75" : { 
    _id : '', 
    } 
}, "4f871d4967e04" : { 
"300" : { 
    _id : '', 
    } 
"150" : { 
    _id : '', 
    } 
"100" : { 
    _id : '', 
    } 
"75" : { 
    _id : '', 
    } 
} 

내가 원하는 크기를 얻을 수 this["300"]을 사용하여 간단하게 각 "그룹"을 반복 할 수 있습니다이 방법을. Handlebar의 템플릿에서이 작업을 반복하고 있으므로 확인할 수있는 조건이 제한됩니다.

어떤 제안이라도 도움이 될 것입니다.

감사합니다.

Answer 1

명백한 일반 제인 자바 스크립트 접근 방식은 아마도 가장 빠른 것 :

var want = { }; 
var k, i, o; 
for(k in data) { 
    want[k] = { }; 
    for(i = 0; i < data[k].length; ++i) { 
     o = data[k][i]; 
     want[k][o.width] = o; 
    } 
} 

간단히 주요 개체 키로 (data) 키를 통해 루프는 폭 → 객체 매핑에 배열을 재 배열 내부 루프를 사용하여 테이블.

당신이 생각해내는 것은 변장의 중첩 루프 일 것입니다.

var want = _(data).reduce(function(outer, v, k) { 
    outer[k] = _(v).reduce(function(inner, o) { 
     inner[o.width] = o; 
     return inner; 
    }, { }); 
    return outer; 
}, { }); 

거의 루프 대신에 reduce로 설정 원래의 중첩 for 루프입니다 : 밑줄 버전은 다음과 같을 것이다. 대부분의 언더 스코어 (Underscore) 기능이 모든 것을 배열로 바꾸기를 원하기 때문에 여기서는 reduce을 사용하는 것으로 제한됩니다. 당신은 each을 사용할 수

var want = { }; 
_(data).each(function(v, k) { 
    var inner = { }; 
    _(v).each(function(o) { 
     inner[o.width] = o; 
    }); 
    want[k] = inner; 
}); 

하지만 그 임시 변수로 reduce 방식과 동일합니다. 아마 다른 접근법을 생각해 낼 수도 있지만 아마이 테마에 대한 변형이있을 것입니다.

데모 :

{{#each images}}<img src="../{{this.300._id}}" />{{/each}} 

그런 다음 당신은 단지 위가 생성하는 것과 값을 원하는 :

---

이 같은 핸들 바의 템플릿에 데이터를 보내려면 http://jsfiddle.net/ambiguous/ffcUC/2/.

var want = [ ]; 
var k, i, o; 
for(k in data) { 
    o = { }; 
    for(i = 0; i < data[k].length; ++i) { 
     o[data[k][i].width] = data[k][i]; 
    } 
    want.push(o); 
} 
return want; 

을 아니면 map 내부 reduce로 전환 : :하지만이 경우에, 당신은 몇 가지 작업을 저장하기 위해 루프를 조정할 수 있습니다

var index_by_height = function(o) { 
    return _(o).reduce(function(memo, i) { 
     memo[i.height] = i; 
     return memo; 
    }, { }); 
}; 
return _.chain(data) 
     .values() 
     .map(index_by_height) 
     .value(); 

데모 : http://jsfiddle.net/ambiguous/tsx7z/