lodash를 사용하여 개체를 어레이로 변환

lodash를 사용하여 개체를 어레이로 변환

어떻게 하면 큰 변화를 가져올 수 있습니까?objectarray 다쉬로로?

var obj = {
  22: {name:"John", id:22, friends:[5,31,55], works:{books:[], films:[],}
  12: {name:"Ivan", id:12, friends:[2,44,12], works:{books:[], films:[],}
}

// transform to 
var arr = [{name:"John", id:22...},{name:"Ivan", id:12...}]

할수있습니다

var arr = _.values(obj);

자세한 내용은 여기를 참조하십시오.

관심 있는 사람이 있다면 최신 네이티브 솔루션:

const arr = Object.keys(obj).map(key => ({ key, value: obj[key] }));

또는 (IE가 아님):

const arr = Object.entries(obj).map(([key, value]) => ({ key, value }));

_.toArray(obj);

출력은 다음과 같이 출력:

[
  {
    "name": "Ivan",
    "id": 12,
    "friends": [
      2,
      44,
      12
    ],
    "works": {
      "books": [],
      "films": []
    }
  },
  {
    "name": "John",
    "id": 22,
    "friends": [
      5,
      31,
      55
    ],
    "works": {
      "books": [],
      "films": []
    }
  }
]"

제게는 효과가 있었습니다.

_.map(_.toPairs(data), d => _.fromPairs([d]));

돌아옵니다

{"a":"b", "c":"d", "e":"f"} 

안으로

[{"a":"b"}, {"c":"d"}, {"e":"f"}]

당신이 추구하는 결과를 얻을 수 있는 방법은 꽤 있습니다.범주별로 구분합니다.

ES6 값만:

이에 대한 기본 메서드는 Object.values입니다.하지만 Object를 사용합니다.키 및 Array.map을 사용하면 예상 결과를 얻을 수 있습니다.

Object.values(obj)
Object.keys(obj).map(k => obj[k])

var obj = {
  A: {
    name: "John"
  },
  B: {
    name: "Ivan"
  }
}

console.log('Object.values:', Object.values(obj))
console.log('Object.keys:', Object.keys(obj).map(k => obj[k]))

ES6 키 및 가치:

맵과 ES6 동적/계산 속성을 사용하고 파괴하면 키를 유지하고 맵에서 개체를 반환할 수 있습니다.

Object.keys(obj).map(k => ({[k]: obj[k]}))
Object.entries(obj).map(([k,v]) => ({[k]:v}))

var obj = {
  A: {
    name: "John"
  },
  B: {
    name: "Ivan"
  }
}

console.log('Object.keys:', Object.keys(obj).map(k => ({
  [k]: obj[k]
})))
console.log('Object.entries:', Object.entries(obj).map(([k, v]) => ({
  [k]: v
})))

Lodash 값만:

그러나 이를 위해 설계된 방법은 객체의 값만 포함하는 배열을 반환하는 유틸리티 방법과 같은 "바로 가기"가 있습니다.당신도 할 수 있습니다._.map비록_.keys그리고 다음을 사용하여 객체에서 값을 가져옵니다.obj[key]표기법

참고:_.map객체가 통과할 때 기본적으로 핸들러를 사용합니다.forEach개체 속성에 있습니다.

_.values(obj)
_.map(obj)
_.toArray(obj)
_.map(_.keys(obj), k => obj[k])

var obj = {
  A: {
    name: "John"
  },
  B: {
    name: "Ivan"
  }
}

console.log('values:', _.values(obj))
console.log('map:', _.map(obj))
console.log('toArray:', _.toArray(obj))
console.log('keys:', _.map(_.keys(obj), k => obj[k]))

<script src="https://cdnjs.cloudflare.com/ajax/libs/lodash.js/4.17.10/lodash.min.js"></script>

Lodash 키 및 가치:

// Outputs an array with [[KEY, VALUE]]
_.entries(obj)
_.toPairs(obj)

// Outputs array with objects containing the keys and values
_.map(_.entries(obj), ([k,v]) => ({[k]:v}))
_.map(_.keys(obj), k => ({[k]: obj[k]}))
_.transform(obj, (r,c,k) => r.push({[k]:c}), [])
_.reduce(obj, (r,c,k) => (r.push({[k]:c}), r), [])

var obj = {
  A: {
    name: "John"
  },
  B: {
    name: "Ivan"
  }
}

// Outputs an array with [KEY, VALUE]
console.log('entries:', _.entries(obj))
console.log('toPairs:', _.toPairs(obj))

// Outputs array with objects containing the keys and values
console.log('entries:', _.map(_.entries(obj), ([k, v]) => ({
  [k]: v
})))
console.log('keys:', _.map(_.keys(obj), k => ({
  [k]: obj[k]
})))
console.log('transform:', _.transform(obj, (r, c, k) => r.push({
  [k]: c
}), []))
console.log('reduce:', _.reduce(obj, (r, c, k) => (r.push({
  [k]: c
}), r), []))

<script src="https://cdnjs.cloudflare.com/ajax/libs/lodash.js/4.17.10/lodash.min.js"></script>

위의 예에서는 ES6가 사용됩니다(화살표 함수 및 동적 속성).ES6에 문제가 있는 경우 lodash 및 기타 방법을 사용하여 개체를 구성할 수 있습니다.

키(이 경우 ID)를 각 어레이 항목의 속성으로 보존하려면 다음 작업을 수행할 수 있습니다.

const arr = _(obj) //wrap object so that you can chain lodash methods
            .mapValues((value, id)=>_.merge({}, value, {id})) //attach id to object
            .values() //get the values of the result
            .value() //unwrap array of objects

플레인 JavaScript를 사용하여 객체를 배열로 변환(ECMAScript-2016) Object.values:

var obj = {
    22: {name:"John", id:22, friends:[5,31,55], works:{books:[], films:[]}},
    12: {name:"Ivan", id:12, friends:[2,44,12], works:{books:[], films:[]}}
}

var values = Object.values(obj)

console.log(values);

키를 계속 사용하려면 다음과 같이 하십시오.

var obj = {
    22: {name:"John", id:22, friends:[5,31,55], works:{books:[], films:[]}},
    12: {name:"Ivan", id:12, friends:[2,44,12], works:{books:[], films:[]}}
}

var values = Object.entries(obj).map(([k, v]) => ({[k]: v}))

console.log(values);

개체를 배열로

제가 생각하는 모든 대답 중에서 이것이 가장 좋은 것 같습니다.

let arr = Object.entries(obj).map(([key, val]) => ({ key, ...val }))

다음과 같이 변환합니다.

{
  a: { p: 1, q: 2},
  b: { p: 3, q: 4}
}

대상:

[
  { key: 'a', p: 1, q: 2 }, 
  { key: 'b', p: 3, q: 4 }
]

배열을 개체로

다시 변환하기

let obj = arr.reduce((obj, { key, ...val }) => { obj[key] = { ...val }; return obj; }, {})

키를 값에 유지한 채로 다시 변환하려면 다음을 수행합니다.

let obj = arr.reduce((obj, { key, ...val }) => { obj[key] = { key, ...val }; return obj; }, {})

다음을 제공:

{
  a: { key: 'a', p: 1, q: 2 },
  b: { key: 'b', p: 3, q: 4 }
}

마지막 예에서는 lodash를 사용할 수도 있습니다._.keyBy(arr, 'key')또는_.keyBy(arr, i => i.key).

2017년 업데이트:Object.values, lodash value 및 toArray가 이 작업을 수행합니다.키 맵 및 스프레드 연산자를 유지하려면 다음과 같이 하십시오.

// import { toArray, map } from 'lodash'
const map = _.map

const input = {
  key: {
    value: 'value'
  }
}

const output = map(input, (value, key) => ({
  key,
  ...value
}))

console.log(output)
// >> [{key: 'key', value: 'value'}])

<script src="https://cdnjs.cloudflare.com/ajax/libs/lodash.js/4.17.4/lodash.js"></script>

var arr = _.map(obj)

사용할 수 있습니다._.map의) lodash그리고.underscore)와 함께object또한 내부적으로 해당 사례를 처리하고 각 값과 키를 반복한 후 마지막으로 배열을 반환합니다.할 수 ._.map(obj) 값 경우 값 배열만 원하는 경우.좋은 점은, 만약 여러분이 그 사이에 어떤 변화가 필요하다면, 그것을 한 번에 할 수 있다는 것입니다.

예:

var obj = {
    key1: {id: 1, name: 'A'},
    key2: {id: 2, name: 'B'},
    key3: {id: 3, name: 'C'}
};

var array1 = _.map(obj, v=>v);
console.log('Array 1: ', array1);

/*Actually you don't need the callback v=>v if you
are not transforming anything in between, v=>v is default*/

//SO simply you can use
var array2 = _.map(obj);
console.log('Array 2: ', array2);

<script src="https://cdnjs.cloudflare.com/ajax/libs/lodash.js/4.17.4/lodash.js"></script>

그러나 객체를 변환하려면 키를 보존해야 하는 경우에도 변환할 수 있습니다._.map(obj, (v, k) => {...})에 추가 인수 포함map원하는 대로 사용할 수 있습니다.

그러나 이에 대한 다른 바닐라 JS 솔루션이 있습니다(모든 경우와 마찬가지로).lodash솔루션은 순수한 JS 버전이어야 합니다). 다음과 같습니다.

• Object.keys그리고 나서.map그들의 가치관.
• Object.values(ES-2017년)
• Object.entries그리고 나서.map각 키/값 쌍(ES-2017)
• for...in각 키를 반복하여 값 페팅에 사용합니다.

그리고 훨씬 더.하지만 이 질문은 다음을 위한 것입니다.lodash(이미 사용하고 있는 사용자가 있다고 가정하면) 버전, 메서드 지원 및 오류 처리에 대해 많이 생각할 필요가 없습니다.

다음과 같은 다른 Lodash 솔루션이 있습니다._.values(특정 목적에 대해 더 읽기 쉽다) 또는 쌍을 얻은 다음 매핑 등을 수행합니다. 그러나 코드가 유연성을 필요로 하는 경우에는 보존해야 할 때 나중에 업데이트할 수 있습니다.keys또는 값을 조금 변환하면 가장 좋은 해결책은 단일 솔루션을 사용하는 것입니다._.map본 회답에서 언급한 바와 같이그것은 또한 가독성만큼 어렵지 않을 것입니다.

개체를 배열로 사용자 지정 매핑(예: originalArray.prototype.map)을 원하는 경우 다음을 사용할 수 있습니다._.forEach:

let myObject = {
  key1: "value1",
  key2: "value2",
  // ...
};

let myNewArray = [];

_.forEach(myObject, (value, key) => {
  myNewArray.push({
    someNewKey: key,
    someNewValue: value.toUpperCase() // just an example of new value based on original value
  });
});

// myNewArray => [{ someNewKey: key1, someNewValue: 'VALUE1' }, ... ];

봐lodash_.for 각 https://lodash.com/docs/ #의 문서

언급URL : https://stackoverflow.com/questions/24674630/transform-object-to-array-with-lodash