Efficiently converting JavaScript key and value arrays to object Efficiently converting JavaScript key and value arrays to object vue.js vue.js

Efficiently converting JavaScript key and value arrays to object


The easiest way maybe to .map the values into key-value tuples and call Object.fromEntries on it:

const theKeys = ['firstName', 'lastName', 'city'];const theValues = [{  data: [    ['John', 'Smith', 'New York'],    ['Mike', 'Doe', 'Chicago']  ]}];console.log(  theValues[0].data.map(e =>    Object.fromEntries(e.map((e,i) => [theKeys[i], e]))  ))


You can get rid of the inner loop if you hardcode the properties instead of looking at theKeys, but I doubt you'd want that. The only thing you don't really need is the flatMap. Most of the generic array methods aren't known for their speed, anyway (forEach is usually slower than a plain for loop, for example).

FWIW, this seems to perform fine:

let result = [];for (let i = 0; i < theValues[0].data.length; i++) {    let resultObj = {};    for (let j = 0; j < theKeys.length; j++) {        resultObj[theKeys[j]] = theValues[0].data[i][j];    }    result.push(resultObj);}

I tested it with 11k items and it ran in about 5 miliseconds in Chrome. With 90k items, it still only took about 30ms.


You can forego the flatMap which should save you some performance, just do everything with plain loop:

const result = []for (const v of theValues) {    for (const entry of v.data) {        const obj = {}        for (let i = 0; i < entry.length; i++) {            obj[theKeys[i]] = entry[i]        }        result.push(obj)    }}

EDIT: micro-optimizations

const result = []const keysLength = theKeys.lengthfor (let i = theValues.length - 1; i >= 0; i--) {    const data = theValues[i].data    for (let j = data.length - 1; j >= 0; j--) {        const entry = data[j]        const obj = {}        for (let k = keysLength - 1; k >= 0; k--) {            obj[theKeys[k]] = entry[k]        }        result.push(obj)    }}