перетворити об'єкт в масив з lodash

Як я можу перетворити велике objectна arrayлодаш?

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);

Документацію дивіться тут.

_.toArray(obj);

Виходи:

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

Сучасне рідне рішення, якщо когось цікавить:

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

або (не IE):

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

Для мене це спрацювало:

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

Виходить

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

в

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

Існує досить багато способів отримати результат, за яким ви прагнете. Розбиваємо їх на категорії:

Значення ES6 лише :

Основний метод для цього - Object.values . Але використання Object.keys і 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 :

Використовуючи динамічні / обчислювані властивості map та 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
})))

Цінності Лодаша :

Метод, розроблений для цього, _.valuesоднак є "ярлики", як _.mapі корисний метод, _.toArrayякий також повертає масив, що містить лише значення від об'єкта. Ви також можете _.mapхоч _.keysі отримати значення від об'єкта, використовуючи obj[key]позначення.

Примітка: _.mapпри передачі об'єкта використовується його baseMapобробник, який в основному 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>

Ключ і значення Лодаша :

// 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 (функції стрілок та динамічні властивості). Ви можете використовувати lodash _.fromPairsта інші методи для складання об'єкта, якщо ES6 є проблемою.

Якщо ви хочете, щоб ключ (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

2017 оновлення: Object.values , lodash значення і 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>

Трансформація об'єкта в масив за допомогою простого 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);

Якщо ви хочете зберегти використання ключів Object.entriesі , Array#mapяк це:

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);

var arr = _.map(obj)

Ви також можете використовувати _.mapфункцію (і обох, lodashі з underscore) object, вона буде внутрішньо обробляти цей випадок, повторювати кожне значення та ключ зі своїм ітератом і, нарешті, повертати масив. Infact, ви можете використовувати його без будь-якого ітерату (просто _.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(і якщо припустити, що хтось вже використовує його), то вам не потрібно багато думати про версію, підтримку методів та обробку помилок, якщо їх не знайдено.

Є й інші рішення для лодашів _.values( настільки зрозумілі для конкретних цілей), або отримання пар, а потім карта тощо. але у випадку, якщо вашому коду потрібна гнучкість, і ви зможете оновити його в майбутньому, оскільки вам потрібно keysтрохи зберегти або перетворити значення, тоді найкращим рішенням буде використання одиничного, _.mapяк адресованого у цій відповіді. Це також буде не таким складним, як на читабельність.

Об'єкт для масиву

З усіх відповідей я вважаю, що цей найкращий:

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).

Якщо ви хочете виконати спеціальне відображення (наприклад, оригінальний Array.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Документ домену _.forEach https://lodash.com/docs/#forEach