從 object 中提取鍵值到具有特定字段的對象數組中

Question

所以我有這個數據：

fields = ['a', 'b', 'c']
data = [{r: 1, a: 2, b: 3, c: 4, h: 5}, {r: 4, a: 9, b: 1, c: 4, h: 5} ... ]

我希望能夠（首選 lodash）能夠做到這一點：

newData = [{r:1, h:5, values: [{name: 'a', value: 2},{name: 'b', value: 3}, {name: 'c', value: 4}], .....]

這意味着只有來自“字段”object 的字段從數組中的每個 object 中取出（它們始終存在）並放入具有此處顯示格式的數組的“值”屬性中。

很想聽聽關於實現這一目標的最干凈方法的建議！

我這樣做了：

function something(data, fields) {

  const formattedData = _.map(data, (currData) => {

    const otherFields = _.omit(currData, fields)

    return { 
      ...otherFields, 
      values: _.flow( 
        currData => _.pick(currData, fields), 
        pickedFields => _.toPairs(pickedFields), 
        pairs => _.map(pairs, pair => { 
          return { name: pair[0], value: pair[1] } 
        })
      )(currData)
    }
  })

  return formattedData
}

哪個有效，但我想知道它是否有點復雜。

Answer 1

您可以通過數據中的對象map ，然后檢查鍵是否在字段數組中：

 fields = ["a", "b", "c"]; data = [ { r: 1, a: 2, b: 3, c: 4, h: 5 }, { r: 4, a: 9, b: 1, c: 4, h: 5 }, ]; let newData = data.map((o) => { let newObject = {}; newObject.values = []; for (let k in o) { if (fields.includes(k)) { newObject.values.push({ name: k, value: o[k] }); } else { newObject[k] = o[k]; } } return newObject; }); console.log(newData);

Answer 2

您可以解構 object，選擇所需屬性並返回 object 的 rest 和所需值。

 const fields = ['a', 'b', 'c'], data = [{ r: 1, a: 2, b: 3, c: 4, h: 5 }, { r: 4, a: 9, b: 1, c: 4, h: 5 }], result = data.map(o => { const values = fields.map(name => { let value; ({ [name]: value, ...o } = o); return { name, value }; }); return {...o, values }; }); console.log(result);

 .as-console-wrapper { max-height: 100%;important: top; 0; }

Answer 3

_.flow()方法創建一個 function，您可以對其進行提取和命名。 另外，流程中的第一個 function 接受多個參數，因此您不需要顯式傳遞它。 由於_.toPairs()是一元的，因此您不需要將其包裝在箭頭 function 中。 object 的創建有點煩人。 我用過_.zipObject() ，但它仍然很麻煩。

現在您可以在您的主 function 中使用由_.flow()創建的 function，它非常易讀：

 const { flow, pick, toPairs, map, partial, zipObject, omit } = _ const propsToObjs = flow( pick, toPairs, pairs => map(pairs, partial(zipObject, ['name', 'value'])), ) const fn = (data, fields) => map(data, currData => ({...omit(currData, fields), values: propsToObjs(currData, fields) })) const fields = ['a', 'b', 'c'] const data = [{r: 1, a: 2, b: 3, c: 4, h: 5}, {r: 4, a: 9, b: 1, c: 4, h: 5}] const result = fn(data, fields) console.log(result)

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

使用 lodash/fp，我們可以使流程 function 更好，因為 lodash/fp 函數是自動柯里化的並且迭代優先數據最后（不是參數的相反順序）：

 const { flow, pick, toPairs, map, partial, zipObject, omit } = _ const propsToObjs = flow( pick, toPairs, map(zipObject(['name', 'value'])) ) const fn = fields => map(currData => ({...omit(fields, currData), values: propsToObjs(fields, currData) })) const fields = ['a', 'b', 'c'] const data = [{r: 1, a: 2, b: 3, c: 4, h: 5}, {r: 4, a: 9, b: 1, c: 4, h: 5}] const result = fn(fields)(data) console.log(result)

 <script src='https://cdn.jsdelivr.net/g/lodash@4(lodash.min.js+lodash.fp.min.js)'></script>