Перестройка массива Javascript для вложенного массива

Question

У меня есть массив объектов, как указано ниже.

const inputArray =[
  {
    name: "Energy",
    quantity: [
      {
        qval: "100 ",
        unit: "unit1"
      },
      {
        qval: "200 ",
        unit: "unit2"
      }
    ],
  },
  {
    name: "Fat",
    quantity: [
      {
        qval: "300",
        unit: "unit3"
      }
    ],
  },
]

Я пытаюсь реструктурировать этот массив, используя следующий код, и я получил что-то, как указано ниже

const outputArray = inputArray.map(function(item,i) {
  return {
    name: item.name,
    amount: (item.quantity[0] && 
    item.quantity[0].qval+item.quantity[0].unit)+'|'+ (item.quantity[1] && item.quantity[1].qval+item.quantity[1].unit),
 };

});

А вот и вывод, который я получил

[
  {name: "Energy", amount: "100 unit1|200 unit2"}
  {name: "Fat", amount: "300unit3|undefined"}
]

Поскольку я новичок в этом, я не думаю, что это хороший метод, пожалуйста, предложите какой-нибудь более простой и понятный код. Я ожидаю

[
  {name: "Energy", amount: "100 unit1|200 unit2"}
  {name: "Fat", amount: "300unit3"}
]

Также мне нужно удалить «неопределенное», если это значение не существует. Пожалуйста, предложите.

Answer 1

Вот довольно простой подход, использующий map для внешнего списка и еще один для количеств для каждого:

const combine = arr => arr.map(({name, quantity}) => ({
  name, 
  amount: quantity.map(({qval, unit}) => `${qval}${unit}`).join('|')
}))

const inputArray = [{name: "Energy", quantity: [{qval: "100 ", unit: "unit1"}, {qval: "200 ", unit: "unit2"}]}, {name: "Fat", quantity: [{qval: "300", unit: "unit3"}]}]

console.log(combine(inputArray))

Самым большим преимуществом этого подхода перед вашим является то, что он работает для любого количества единиц товара. Не существует специального кода для первого или второго.

Answer 2

поехали

inputArray.map(item => ({
    name: item.name,
    amount: item.quantity.reduce((accumulator, currentValue) => (accumulator+currentValue.qval+currentValue.unit+"|"),"").slice(0, -1)
}))

Answer 3

Используйте цикл for для перебора длины item.quantity, если в нем будет неопределенное количество элементов:

const outputArray = inputArray.map(function(item, i) {
  let amountStr = "";
  for (i = 0; i < item.quantity.length; i++) {
    amountStr += item.quantity[i].qval + item.quantity[i].unit;
    // add delimiter when the current item is not the last one in the array
    if (i < quantity.length - 1) amountStr += "|";
  }
  return {
    name: item.name,
    amount: amountStr
 };

Answer 4

Вы должны проверить наличие определенного элемента в индексе, прежде чем использовать его. Вот соответствующие изменения:

const outputArray = inputArray.map(function(item, i) {
    var qt = "";
    if (item.quantity[0]) {
        qt += (item.quantity[0].qval + item.quantity[0].unit);
    }
    if (item.quantity[1]) {
        qt += '|';
        qt += (item.quantity[1].qval + item.quantity[1].unit);
    }
    return {
        name: item.name,
        amount: qt
    };
});

Answer 5

Вы можете добавить троичные условия внутри функции карты, чтобы учесть переменные, которые могут быть не объявлены. Например:

const inputArray =[
  {
    name: "Energy",
    quantity: [
      {
        qval: "100 ",
        unit: "unit1"
      },
      {
        qval: "200 ",
        unit: "unit2"
      }
    ],
  },
  {
    name: "Fat",
    quantity: [
      {
        qval: "300",
        unit: "unit3"
      }
    ],
  },
]


const outputArray = inputArray.map(function(item,i) {
  return {
    name: item.name,
    amount: `${item.quantity[0] ? 
    item.quantity[0].qval+item.quantity[0].unit : ''}${item.quantity[1] ? `|${item.quantity[1].qval+item.quantity[1].unit}` : ''}`,
 };
})

console.log(outputArray);

Если свойства каждого из объектов также не гарантированы - вам нужно добавить проверки и для самих свойств. Например:

(item[0] && item[0].prop1 && item[0].prop2) ? 'stuff' : 'otherstuff'