2017-10-03 13 views
0

/시험 병합에 더 좋은 방법 : 우리는 이것을 현재깊은 갱신 lodash와 ES6의 개체 또는 깊은 갱신하는 방법을 찾고 다른 라이브러리

하고있어 :

{ 
    ..._companies, 
    ['c124']: { 
     ..._companies.c124, 
     ['fields']: { 
      ..._companies.c124.fields, 
      ['f4']: { 
       ..._companies.c124.fields.f4, 
       value: 'white' 
      } 
     } 
    } 

이상적으로 우리는이 작업을 수행 할 때 : 그것은 완전히 C124 키를 대체로

update_merge(_companies, { 
    c124: { 
     fields: { 
      f4: { 
       value:'white' 
      } 
     } 
    } 
}) 

간단한 완전 병합이 경우 작동하지 않습니다.

원래 _companies는 니펫을 :

const companies = { 
    c123: { 
     id: 123, 
     name: 'Company one', 
     fields: {...} // fields     
    }, 
    c124: { 
     id: 124, 
     name: 'Company two', 
     fields: { 
      f1: {...}, //...fields     
      f2: {...}, //...fields     
      f3: {...}, //...fields     
      f4: { 
       id: 4, 
       fieldType: "shortText",longText 
       title: "favorite color", 
       value: 'green', // <==== only this will change 
      }, 
     }, 
    } 
} 

이 예상 결과 : 우리가 immutability-helper을 사용하는 우리의 프로젝트에서

const companies = { 
    c123: { 
     id: 123, 
     name: 'Company one', 
     fields: {...} // fields     
    }, 
    c124: { 
     id: 124, 
     name: 'Company two', 
     fields: { 
      f1: {...}, //...fields     
      f2: {...}, //...fields     
      f3: {...}, //...fields     
      f4: { 
       id: 4, 
       fieldType: "shortText",longText 
       title: "favorite color", 
       value: 'white', // <==== this changed 
      }, 
     }, 
    } 
} 
+0

원래 '회사'개체를 추가 하시겠습니까? –

+0

...과 예상되는 결과입니다. –

+0

@OriDrori 요청시 추가됨 – Guy

답변

1

Lodash의 _.merge()가 재귀입니다 lodash/fp

에서 Ramda assocPath 또는 set을 시도하고 당신이 중첩 된 키를 (주 업데이트 할 수 있습니다 - 나는 파란색에서 값을 변경하고있어 빨간색) :

const companies = {"c123":{"id":123,"name":"Company one","fields":{}},"c124":{"id":124,"name":"Company two","fields":{"f1":{},"f2":{},"f3":{},"f4":{"id":4,"fieldType":"shortText","title":"favorite color","value":"blue"}}}}; 
 

 
const newCompanies = _.merge({}, companies, { 
 
    c124: { 
 
     fields: { 
 
      f4: { 
 
       value:'red' 
 
      } 
 
     } 
 
    } 
 
}) 
 

 
console.log(newCompanies);
<script src="https://cdnjs.cloudflare.com/ajax/libs/lodash.js/4.17.4/lodash.min.js"></script>
,536 그러나

const companies = {"c123":{"id":123,"name":"Company one","fields":{}},"c124":{"id":124,"name":"Company two","fields":{"f1":{},"f2":{},"f3":{},"f4":{"id":4,"fieldType":"shortText","title":"favorite color","value":"blue"}}}}; 
 

 
_.set(companies, ['c124', 'fields', 'f4', 'value'], 'red') 
 

 
console.log(companies);
<script src="https://cdnjs.cloudflare.com/ajax/libs/lodash.js/4.17.4/lodash.min.js"></script>

당신이 수시로, 예를 들면 REDUX에 (불변의 객체가 필요한 경우 : 91,363,210

또 다른 옵션은 개체를 변이 할 수있는 경우 lodash의 _.set()를 사용하는 것입니다), 나는 더 접근 할 수있는 잎이 더 얕도록 normalizing 나무를 제안 할 것이다.

1

합니다. MongoDB와 같은 쿼리를 허용합니다. 정말로 가치가있는 체크 아웃!

+0

좋아요! 미래의 독자를 위해서 당신의 답에 해결책을 추가 할 수 있다면 : http://jsbin.com/zunehubuju/edit?js. 나는 너의 대답을 기꺼이 받아 들일 것이다. – Guy

0

당신은 둘 다 불변

R.assocPath(['c124', 'fields', 'f4', 'value'], 'white', _companies); 
_.set(['c124', 'fields', 'f4', 'value'], 'white', _companies); 
_.set('c124.fields.f4.value', 'white', _companies);