Как условно получить длину ключа в массиве объектов с помощью React JS

Question

У меня есть массив объектов с размером> 0. Теперь на основе длины ключа isTraining для всех объектов я должен управлять элементами DOM.

(7) [{…}, {…}, {…}, {…}, {…}, {…}, {…}]
    0:
    id: "xxx"
    accreditation: "xxxx xxx xxx"
    institution: "xxxx xxx xxx xxxx xxx xxx"
    location: "xxxx xxx xxx"
    dateStart: "1982-06-01 00:00:00"
    dateEnd: "1984-06-01 00:00:00"
    description: "xxxx xxx xxx"
    award: "xxxx xxx xxx"
    isTraining: "0"

Например, если я имеет 10 объектов, и среди этих 6 объектов значение isTraining равно 0, а у остальных 4 объектов значение isTraining равно 1. Теперь Как отфильтровать или отобразить объекты, чтобы узнать длину ключа isTraining со значениями 0 и 1?

В моем случае ожидаемый результат будет примерно таким:

Количество учебных заведений: 6 Количество учебных курсов: 4

Что является наиболее эффективным метод итерации и определения длины ключа на основе его значения?

Answer 1

Вы можете использовать array.filter ()

let array = [{
  id: 1,
  isTraining: 0
}, {
  id: 2,
  isTraining: 0
}, {
  id: 3,
  isTraining: 1
}, {
  id: 4,
  isTraining: 0
}, {
  id: 5,
  isTraining: 1
}];

let length = array.filter(item => item.isTraining === 0).length

Answer 2

Самый краткий способ, используйте Array.prototype.reduce

const [educationCount, trainingCount] = arr.reduce(([a, b], item) => [
  a + item.isTraining == '0' ? 1 : 0,
  b + item.isTraining == '1' ? 1 : 0,
], [0, 0])

Answer 3

Уменьшение массива в объект с использованием isTraining строкового значения в качестве ключей результата.

const data = [
  { isTraining: "0" },
  { isTraining: "1" },
  { isTraining: "1" },
  { isTraining: "0" },
  { isTraining: "1" },
  { isTraining: "0" },
  { isTraining: "1" },
  { isTraining: "0" },
  { isTraining: "1" },
  { isTraining: "1" },
];

const res = data.reduce((acc, { isTraining }) => {
  acc[isTraining]++;
  return acc;
}, {"0": 0, "1": 0});

console.log(res)

Answer 4

Вы можете использовать метод 'filter' для фильтрации объектов на основе заданного условия следующим образом

const results = items.filter(item => {
    return item.isTraining === "0";
});

console.log(result.length);

, и вы можете отобразить результаты следующим образом

{
    items.filter(item => {
        return item.isTraining === "0";
    }).map(item => { return (<li key={item.id}>{ item.id }</li>);
}

Answer 5

Вы можете использовать forEach l oop и продолжать увеличивать число переменных.

Как это

let myArray = [{
  dateEnd: "1984-06-01 00:00:00",
  description: "xxxx xxx xxx",
  isTraining: "0"
}];

let isTrainingTrue = 0;
let isTrainingFalse = 0;
myArray.forEach(item => {
    if(item.isTraining === "0"){
        isTrainingFalse += 1;
    }else{
        isTrainingTrue += 1;
    }
});

console.log('isTrainingTrue', isTrainingTrue);
console.log('isTrainingFalse', isTrainingFalse);

РЕДАКТИРОВАТЬ

, вы можете упростить использование reduce funciton:

let [isTrainingTrue, isTrainingFalse] = myArray.reduce((a,v,i) => {
    v.isTraining === "1" ? a[0] += 1 : a[1] += 1;
    return a;
},[0,0]);

console.log('isTrainingTrue', isTrainingTrue, isTrainingFalse);