根據過濾后的對象數組中的數據創建新的對象數組

Question

我有一個對象數組，其鍵名為“ selected”，該鍵設置為false。 我從原始列表中篩選出一組對象，其中“選擇”鍵設置為true。 如何創建一個新數組，其中基於過濾后的列表使用真實值更新原始列表？

 const data = [{ color: "red", value: "#f00", selected: false }, { color: "green", value: "#0f0", selected: false }, { color: "blue", value: "#00f", selected: false }, { color: "cyan", value: "#0ff", selected: false }, { color: "magenta", value: "#f0f", selected: false }, { color: "yellow", value: "#ff0", selected: false }, { color: "black", value: "#000", selected: false } ] const filtered = [{ color: "magenta", value: "#f0f", selected: true }, { color: "green", value: "#0f0", selected: true }, { color: "black", value: "#000", selected: true }] const newData = data.map(item => { item.selected = filtered.find(item1 => item1.id === item.id).selected return item }) console.log(newData) 

最終結果應該是

    [{
        color: "red",
        value: "#f00",
        selected: false
      },
      {
        color: "green",
        value: "#0f0",
        selected: **true**
      },
      {
        color: "blue",
        value: "#00f",
        selected: false
      },
      {
        color: "cyan",
        value: "#0ff",
        selected: false
      },
      {
        color: "magenta",
        value: "#f0f",
        selected: **true**
      },
      {
        color: "yellow",
        value: "#ff0",
        selected: false
      },
      {
        color: "black",
        value: "#000",
        selected: **true**
      }
    ]

Answer 1

將filtered數組的選定顏色名稱存儲在Set中。 然后使用“映射時設置”來決定選擇哪些項目：

 const data = [{"color":"red","value":"#f00","selected":false},{"color":"green","value":"#0f0","selected":false},{"color":"blue","value":"#00f","selected":false},{"color":"cyan","value":"#0ff","selected":false},{"color":"magenta","value":"#f0f","selected":false},{"color":"yellow","value":"#ff0","selected":false},{"color":"black","value":"#000","selected":false}] const filtered = [{"color":"magenta","value":"#f0f","selected":true},{"color":"green","value":"#0f0","selected":true},{"color":"black","value":"#000","selected":true}] const selectedSet = new Set(filtered.map(o => o.color)) const newData = data.map(o => selectedSet.has(o.color) ? ({ ...o, selected: true }) : o) console.log(newData) 

Answer 2

如果找到對象，則需要檢查color屬性並返回一個具有更改的屬性的新對象。

 const data = [{ color: "red", value: "#f00", selected: false }, { color: "green", value: "#0f0", selected: false }, { color: "blue", value: "#00f", selected: false }, { color: "cyan", value: "#0ff", selected: false }, { color: "magenta", value: "#f0f", selected: false }, { color: "yellow", value: "#ff0", selected: false }, { color: "black", value: "#000", selected: false }], filtered = [{ color: "magenta", value: "#f0f", selected: true }, { color: "green", value: "#0f0", selected: true }, { color: "black", value: "#000", selected: true }], newData = data.map(item => { var object = filtered.find(item1 => item1.color === item.color); return Object.assign({}, item, object && { selected: object.selected }); }); console.log(newData) 

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