Получите соответствующие свойства из массива объектов и поместите их в новый массив

Question

У меня есть массив объектов со следующей структурой:

let arr = [
  {name: "abc", show: true , display:"ABC"},
  {name: "xyz", show: false , display:"XYZ"},
  {name: "pqr", show: true , display:"PQR"},
  {name: "lmn", show: false , display:"LMN"}
]

Я хочу, чтобы выходные данные были двумя массивами, один для show:true, а другой для show:false, т. Е. Основанный назначение show свойства.В идеале, единственная функция, которая дает мне оба массива, была бы великолепна.Я ожидаю следующий вывод:

arr1 = ["abc", "pqr"]
arr2 = ["xyz", "lmn"]

Мой текущий подход:

// Approach I have tried so far:

var results = arr.filter(function(entry) { 
    return entry.show === false;
});

Но это дает мне массив объектов, и вместо этого я хочу массив с names.Может ли кто-нибудь помочь мне с этим?

Answer 1

Одним из возможных решений этой проблемы является использование Array.reduce () для генерации объекта с требуемыми массивами, затем вы можете получить доступ к этим массивам позже.

let arr = [
  {name: "abc", show: true , display:"ABC"},
  {name: "xyz", show: false , display:"XYZ"},
  {name: "pqr", show: true , display:"PQR"},
  {name: "lmn", show: false , display:"LMN"}
];
          
var res = arr.reduce((acc, {show, name}) =>
{
    if (show)
        acc.show.push(name);
    else
        acc.noShow.push(name);

    return acc;

}, {show:[], noShow:[]});

console.log("show => true", res.show);
console.log("show => false", res.noShow);

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

Answer 2

Вы можете использовать .reduce для построения многомерного массива, а затем вставить name в индекс 0, если show is false, и нажать в индекс 1, если show is true, например, так :

let arr = [ 
  {name: "abc", show: true , display:"ABC"},
  {name: "xyz", show: false , display:"XYZ"},
  {name: "pqr", show: true , display:"PQR"},
  {name: "lmn", show: false , display:"LMN"}
];
          
let [arr2, arr1] = arr.reduce(
        (acc, {name, show}) => (acc[+show].push(name), acc), 
    [[], []]);

console.log(arr1); // ["abc", "pqr"]
console.log(arr2); // ["xyz", "lmn"]

Answer 3

Использование библиотеки вроде Ramda.js делает решения красивыми и короткими

const arr = [
  {name: "abc", show: true , display:"ABC"},
  {name: "xyz", show: false , display:"XYZ"},
  {name: "pqr", show: true , display:"PQR"},
  {name: "lmn", show: false , display:"LMN"}
]


const f = R.pipe(
  R.partition(R.prop("show")), 
  R.map(R.pluck("name"))
)

console.log(f(arr))

<script src="//cdn.jsdelivr.net/npm/ramda@latest/dist/ramda.min.js"></script>

Answer 4

ForEach каждый объект, затем проверьте свойство show. Если show == true, тогда передать содержимое в массив, в другой массив

let arr = [{name: "abc",show: true,display: "ABC"},{name: "xyz",show: false,display: "XYZ"},{name: "pqr",show: true,display: "PQR"},{name: "lmn",show: false,display: "LMN"}]
let arr1 = [], arr2 = [];
arr.forEach((val, intt) => {
  if (val.show) {
    arr1.push(val.name)
  } else {
    arr2.push(val.name)
  }
})
console.log(arr1);
console.log(arr2);

Используя .map, вы можете сделать это, возвращая массив из него, например

let arr = [{name: "abc",show: true,display: "ABC"},{name: "xyz",show: false,display: "XYZ"},{name: "pqr",show: true,display: "PQR"},{name: "lmn",show: false,display: "LMN"}]
let arr1 = arr.map((val,intt) => { if (val.show) return val.name }).filter(n => n)
let arr2 = arr.map((val,intt) => { if (!val.show) return val.name }).filter(n => n)
console.log(arr1);
console.log(arr2)

Это то же самое. В первой функции мы возвращаем только те значения, которые имеют show == true, а второе замыкание возвращает противоположное. Мы используем array.filter(n => n) для фильтрации пустых значений

Answer 5

Попробуйте это:

let arr = [ {name: "abc", show: true , display:"ABC"},
            {name: "xyz", show: false , display:"XYZ"},
            {name: "pqr", show: true , display:"PQR"},
            {name: "lmn", show: false , display:"LMN"}
          ]
          
const match = (bool) => arr.filter(res => res.show === bool).map(ele => ele.name);

console.log(match(true));
console.log(match(false));