Обновите массив объектов в зависимости от значения другого массива объектов

#javascript #arrays #reactjs #object

Вопрос:

У меня есть два массива объектов, и я хочу обновить один в зависимости от значения свойства другого.

Если driveTypeArray.multiAssign это правда и driveTypeArray.type === drive.type , drive.ready должно стать правдой.

В массиве driveTypeArray есть два типа с multiAssign: true , и в результатах он дает мне только один диск с ready:true

Я пытался, forEach но я думаю, что моя логика неверна.

 const driveTypeArray = [{
    type: "HDD",
    multiAssign: false,
    amount: 0,
  },
  {
    type: "SSD",
    multiAssign: true,
    amount: 0,
  },
  {
    type: "EXT",
    multiAssign: false,
    amount: 0,
  },
  {
    type: "NVMe",
    multiAssign: true,
    amount: 0,
  },
]
const drives = [{
    label: "SanDisk SDFJGKHR234234",
    serial: "",
    size: "255 GB",
    type: "SSD",
    ready: false,
    inProgress: false,
    progress: 0
  },
  {
    label: "TOSHIBA HDWD130 - TOSHIBA PRODUCT",
    serial: "",
    size: "2.4 TB",
    type: "HDD",
    ready: false,
    inProgress: false,
    progress: 0
  },
  {
    label: "SanDisk SDFJGKHR234234",
    serial: "",
    size: "255 GB",
    type: "NVMe",
    ready: false,
    inProgress: false,
    progress: 0
  },
  {
    label: "TOSHIBA HDWD130 - TOSHIBA PRODUCT",
    serial: "",
    size: "2.4 TB",
    type: "EXT",
    ready: false,
    inProgress: false,
    progress: 0
  },
]

let driveState = {};

driveTypeArray.map(dType =>
  driveState = {
    drives: drives.map(drive => (drive.type === dType.type ? {
      ...drive,
      ready: true
    } : drive))
  }
)

console.log(driveState) 
 <script src="https://cdnjs.cloudflare.com/ajax/libs/react/16.6.3/umd/react.production.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/react-dom/16.6.3/umd/react-dom.production.min.js"></script> 

Ответ №1:

 const driveTypeArray = [{
    type: "HDD",
    multiAssign: false,
    amount: 0,
  },
  {
    type: "SSD",
    multiAssign: true,
    amount: 0,
  },
  {
    type: "EXT",
    multiAssign: false,
    amount: 0,
  },
  {
    type: "NVMe",
    multiAssign: true,
    amount: 0,
  },
]
const drives = [{
    label: "SanDisk SDFJGKHR234234",
    serial: "",
    size: "255 GB",
    type: "SSD",
    ready: false,
    inProgress: false,
    progress: 0
  },
  {
    label: "TOSHIBA HDWD130 - TOSHIBA PRODUCT",
    serial: "",
    size: "2.4 TB",
    type: "HDD",
    ready: false,
    inProgress: false,
    progress: 0
  },
  {
    label: "SanDisk SDFJGKHR234234",
    serial: "",
    size: "255 GB",
    type: "NVMe",
    ready: false,
    inProgress: false,
    progress: 0
  },
  {
    label: "TOSHIBA HDWD130 - TOSHIBA PRODUCT",
    serial: "",
    size: "2.4 TB",
    type: "EXT",
    ready: false,
    inProgress: false,
    progress: 0
  },
]

const updatedDrives = drives.map(drive => {
    const driveType = driveTypeArray.find(driveType => driveType.type === drive.type)
     if(driveType.multiAssign){
        return {...drive, ready: true}
     }
   return drive
})

console.log(updatedDrives) 

Комментарии:

1. Спасибо @Shyam

Ответ №2:

Это изменяет drives массив для установки ready в соответствии с вашей логикой. Это то, чего ты добивался?

 const driveTypeArray = [{
    type: "HDD",
    multiAssign: false,
    amount: 0,
  },
  {
    type: "SSD",
    multiAssign: true,
    amount: 0,
  },
  {
    type: "EXT",
    multiAssign: false,
    amount: 0,
  },
  {
    type: "NVMe",
    multiAssign: true,
    amount: 0,
  },
]
const drives = [{
    label: "SanDisk SDFJGKHR234234",
    serial: "",
    size: "255 GB",
    type: "SSD",
    ready: false,
    inProgress: false,
    progress: 0
  },
  {
    label: "TOSHIBA HDWD130 - TOSHIBA PRODUCT",
    serial: "",
    size: "2.4 TB",
    type: "HDD",
    ready: false,
    inProgress: false,
    progress: 0
  },
  {
    label: "SanDisk SDFJGKHR234234",
    serial: "",
    size: "255 GB",
    type: "NVMe",
    ready: false,
    inProgress: false,
    progress: 0
  },
  {
    label: "TOSHIBA HDWD130 - TOSHIBA PRODUCT",
    serial: "",
    size: "2.4 TB",
    type: "EXT",
    ready: false,
    inProgress: false,
    progress: 0
  },
]

//If driveTypeArray.multiAssign is true and driveTypeArray.type === drive.type, drive.ready should become true.

//In array driveTypeArray there are two types with multiAssign: true and in results it gives me only one drive with ready:true

let driveState = {};

driveTypeArray.forEach(dType => {
  drives.map(drive => {
    if (dType.multiAssign amp;amp; drive.type === dType.type)
      drive.ready = true;
    return drive;
  })

})

console.log(drives) 
 <script src="https://cdnjs.cloudflare.com/ajax/libs/react/16.6.3/umd/react.production.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/react-dom/16.6.3/umd/react-dom.production.min.js"></script> 

Комментарии:

1. Во-первых, спасибо вам за ваш ответ и за указание на мутацию. Я читал об этом, и вы были правы, я не ищу мутации. Но если мутация будет хорошей, это сработает.