Обновить значение ключа в объекте для всех вхождений

#javascript #arrays

#javascript #массивы

Вопрос:

Привет, я пытаюсь обновить цену внутри массива, моя цель — обновить цену для всех вхождений ID.

 finalbrarray : [    
        { id: 136, name: 'Chocolate - Chips Compound', price: '235.92' },
        { id: 137, name: 'Appetizer - Chicken Satay', price: '199.69' },
        { id: 138, name: 'Compound - Mocha', price: '431.16' },
        { id: 139, name: 'Syrup - Chocolate', price: '427.25' },
        { id: 139, name: 'Syrup - Chocolate', price: '427.25' },
        { id: 140, name: 'Lamb - Leg, Boneless', price: '183.44' },
        { id: 141, name: 'Jam - Blackberry, 20 Ml Jar', price: '493.03' },
        { id: 142, name: 'Lid - 3oz Med Rec', price: '259.42' }
      ]
    

  

Я пытаюсь обновить цену с помощью следующей функции:

   const handleTextClick = id => e => {
    const objIndex = finalbrArray.findIndex(br => br.id === id);
    finalbrArray[objIndex].price = e.target.value;
    const updatedObj = { ...finalbrArray[objIndex], price: e.target.value };
    console.log(updatedObj);

    console.table(finalbrArray);
  };
  

Это обновляет первое вхождение «id: 139», то есть индекс 3..

Я хочу иметь возможность изменять значение как с индексом 3, так и с индексом 4..

Ответ №1:

findIndex находит первое вхождение предиката. Вы можете достичь своей цели с помощью map :

 const arr = [    
        { id: 136, name: 'Chocolate - Chips Compound', price: '235.92' },
        { id: 137, name: 'Appetizer - Chicken Satay', price: '199.69' },
        { id: 138, name: 'Compound - Mocha', price: '431.16' },
        { id: 139, name: 'Syrup - Chocolate', price: '427.25' },
        { id: 139, name: 'Syrup - Chocolate', price: '427.25' },
        { id: 140, name: 'Lamb - Leg, Boneless', price: '183.44' },
        { id: 141, name: 'Jam - Blackberry, 20 Ml Jar', price: '493.03' },
        { id: 142, name: 'Lid - 3oz Med Rec', price: '259.42' }
      ];
    
const update = (arr, id, value) => arr.map(it => it.id === id ? (it.price=value, it) : it);

console.log(update(arr, 139, 100))  

Ответ №2:

Вы должны использовать filter, чтобы получить подмножество совпадающих значений. findIndex вернет индекс первого вхождения внутри массива.

 var finalbrarray = [{
    id: 136,
    name: 'Chocolate - Chips Compound',
    price: '235.92'
  },
  {
    id: 137,
    name: 'Appetizer - Chicken Satay',
    price: '199.69'
  },
  {
    id: 138,
    name: 'Compound - Mocha',
    price: '431.16'
  },
  {
    id: 139,
    name: 'Syrup - Chocolate',
    price: '427.25'
  },
  {
    id: 139,
    name: 'Syrup - Chocolate',
    price: '427.25'
  },
  {
    id: 140,
    name: 'Lamb - Leg, Boneless',
    price: '183.44'
  },
  {
    id: 141,
    name: 'Jam - Blackberry, 20 Ml Jar',
    price: '493.03'
  },
  {
    id: 142,
    name: 'Lid - 3oz Med Rec',
    price: '259.42'
  }
]

// I'm passing id 139 for example. amp; setting the value to '500'

// filter returns an array where the criteria matches, then I'm calling forEach on new array returned by fiter and changing the values of price
finalbrarray.filter(br => br.id === 139).forEach((item) => {
  item.price = '500'
})

// Open console to see the values updated
console.table(finalbrarray);  

Откройте консоль, чтобы увидеть обновляемые значения