將字符串數組轉換為 Object

Question

給定以下值：

const values = ['name1|engine1|color1', 'name2|engine2|color2', 'name3|engine3|color3']

我想為相同的 position 的值創建一個數組，如下所示：

cars = {
  names: ['name1', 'name2', 'name3'],
  engines: ['engine1', 'engine2', 'engine3'],
  colors: ['color1', 'color2', 'color3'],
  ...other properties
}

我試着這樣做：

values.reduce((acc, value) => {
  const [name, engine, color] = value.split('|')

  acc.names.push(name)
  acc.engines.push(engine)
  acc.colors.push(color)

  return acc
}, {})

問題是 acc.name、acc.engine 和 acc.color 還不存在，並且在推送時會出錯。 考慮到它們將具有其他屬性，有什么方法可以干凈利落地做到這一點？

Answer 1

• 情況1。

 const values = [ "name1|engine1|color1", "name2|engine2|color2", "name3|engine3|color3" ]; const cars = { names: [], engines: [], colors: [] }; const result = values.reduce((acc, value) => { const [name, engine, color] = value.split("|"); acc.names.push(name); acc.engines.push(engine); acc.colors.push(color); return acc; }, cars); console.log(result);

• 案例2。

 const values = [ "name1|engine1|color1", "name2|engine2|color2", "name3|engine3|color3" ]; const result = values.reduce((acc, value) => { const [name, engine, color] = value.split("|"); (acc.names??= []).push(name); (acc.engines??= []).push(engine); (acc.colors??= []).push(color); return acc; }, {}); console.log(result);

Answer 2

如果你有一個很長的屬性名稱，你也可以這樣做：

const values = [
  "name1|engine1|color1",
  "name2|engine2|color2",
  "name3|engine3|color3"
];

const keys = ["names", "engines", "colors", ...];

const results = values.reduce((acc, value) => {
  const segments = value.split("|");
  keys.forEach((key, index) => {
    (acc[key] ??= []).push(segments[index]);
  });
  return acc;
}, {});

console.log(results)

Answer 3

Object.fromEntries可以通過簡單的map調用輕松做到這一點：

 const reconstruct = (names, values) => values.map (v => Object.fromEntries (v.split ('|').map ((v, i) => ([names[i], v])))) console.log (reconstruct ( ['name', 'engine', 'color'], [ 'name1|engine1|color1', 'name2|engine2|color2', 'name3|engine3|color3' ]))

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

我們將每個字符串轉換為[['name', 'name1'], ['engine', 'engine1'], ['color', 'color1']]類的內容，然后調用Object.fromEntries 。