2015-08-19 8 views
16

Sto per utilizzare forOwn per iterare attraverso le proprietà di un oggetto e creare un array manualmente e non può aiutare a pensare che ci sia già un oneliner disponibile per farlo.lodash - project/transform object in key value array

{ 
    prop1 : "value", 
    prop2: { sub:1} 
} 

a:

[ 
    {key: "prop1", value: "value"}, 
    {key: "prop2", value: {sub:1}} 
] 

Grazie

risposta

24

È possibile utilizzare di lodash _.map(): di

var obj = { 
 
    prop1 : "value", 
 
    prop2: { sub:1} 
 
}; 
 

 
var result = _.map(obj, function(value, prop) { 
 
    return { prop: prop, value: value }; 
 
}); 
 

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

Oppure si può farlo utilizzando ES6 array destructuring, con Shorthand property names e Object#entries (ECMAScript 2017 Bozza) o lodash _.entries:

const obj = { 
 
    prop1 : "value", 
 
    prop2: { sub:1} 
 
}; 
 

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

 
console.log(result);

+0

Ho contrassegnato questo come risposta in quanto si adatta al mio problema usando lodash come richiesto. Tuttavia, ho aggiunto una _.map alla pagina jsperf confrontandoli. http://jsperf.com/loop-for-in-vs-object-keys-foreach/19 (scusate lo snippet aggiuntivo che qualcuno ha aggiunto per l'array op - rovinato completamente il test), ma quando si confronta il forOwn con la mappa, non c'è alcun vantaggio reale – sambomartin

+0

Il vantaggio non è nelle prestazioni, ma in "oneliner già disponibile per farlo" come richiesto :) Comunque, ricorda che la differenza di prestazioni si nota solo in una grande quantità di elementi, e se questo non è il problema vai con '_.map() 'come è più leggibile (almeno per me). –

9

Non c'è nemmeno bisogno lodash per questo:

var arr = Object.keys(obj).map(function(key){ 
    return { key: key, value: obj[key] }; 
}); 
+0

grazie per la risposta, interessante Object.keys è più lento di forOwn. http://jsperf.com/loop-for-in-vs-object-keys-foreach/19 - qualcuno ha rovinato il test aggiungendo alcune opzioni di array, ma guarda Object.keys vs _.forOwn vs quello nuovo ho aggiunto _.map – sambomartin

+0

@sambomartin Ovviamente sarà "più veloce" dal momento che internally lodash usa solo il ciclo while per l'iterazione. Ma poi di nuovo, la domanda non ha mai richiesto prestazioni, ma qualcosa che è già disponibile. – Joseph

1

È possibile utilizzare pairs se si adatta il vostro caso:

_.pairs({ 'barney': 36, 'fred': 40 }); 
// → [['barney', 36], ['fred', 40]] 

Rif: https://lodash.com/docs#pairs

+0

Ma non si adatta al suo caso. –

1

In risposta al commento di Ori e per completezza, ho postato la versione _.forOwn. È leggermente più veloce, ma è necessario dichiarare prima l'array (non-uno-liner).

var arr = []; 
_.forOwn(obj,function(item, key) { 
    arr.push({ property : key, value : item}); 
}); 
+0

@ori questa è la versione forOwn. Grazie per l'aiuto. (Http://jsperf.com/loop-for-in-vs-object-keys-foreach/19) – sambomartin

9

Un po 'di ES6:

_.map(obj, (value, key) => ({key,value}))

2

Se si utilizza lodash/fp è possibile utilizzare _.entries

const a = { one: 123, two: { value: 'b' }}; 
 

 
const pairs = _.entries(a).map(p => ({ key:p[0], value: p[1] })) 
 

 
console.log(pairs) 
 
// [ 
 
// { 
 
//  "key": "one", 
 
//  "value": 123 
 
// }, 
 
// { 
 
//  "key": "two", 
 
//  "value": { 
 
//  "value": "b" 
 
//  } 
 
// } 
 
// ]
<script src="https://cdnjs.cloudflare.com/ajax/libs/lodash.js/4.15.0/lodash.js"></script> 
 
<script src="https://cdnjs.cloudflare.com/ajax/libs/lodash-fp/4.15.0/lodash-fp.js"></script>

Problemi correlati