獲取不包含特定鍵的物件

我有一個部分，用戶可以在其中過濾下拉選擇的不同資料，

我有一組資料如下。

const data = [
    {
        name: 'Trump',
        country: 'USA',
        age: 70,
        IQ: 140,
    },
    {
        name: 'ID Amini',
        country: 'Uganda',
        age: 50,
    },
    {
        name: 'Kenyatta',
        country: 'Kenya',
        age: 60,
        
    },
    {
        name: 'Obama',
        country: 'USA',
        age: 45,
        IQ: 141
        
    }
]

我的目標也是能夠獲取所有不包含 IQ 的物件，正如您在上面的陣列中看到的那樣，有些物件不包含 IQ。

現場演示：演示

這是我到目前為止所嘗試的。

let filter = ['empty']; // passed dynamically u can pass eg Obama, kenyata etc etc
let filterTyped ='IQ' // passed dynamically als here u can pass name, country etc etc

let filtredData = filter.forEach((item) =>{
    let dataFilter = data.find((element) =>{
        //return all objects which does not contain IQ if Item is empyt
        if(item === 'empty'){
            return element[filterTyped] ==undefined;
        }
        // return found object
        return element[filterTyped] ==item;
    })

    console.log('Filtred', dataFilter)
    if(!dataFilter) return;
})

知道如何解決這個問題嗎？

uj5u.com熱心網友回復：

實作此目的的兩種方法：

1. 檢查hasOwnProperty方法：

const data = [
  { name: 'Trump', country: 'USA', age: 70, IQ: 140 },
  { name: 'ID Amini', country: 'Uganda', age: 50 },
  { name: 'Kenyatta', country: 'Kenya', age: 60 },
  { name: 'Obama', country: 'USA', age: 45, IQ: 141 }
];

const filtered = data.filter((e) => !e.hasOwnProperty('IQ'));

console.log(filtered);

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

2. 檢查解構：

小心使用 justIQ和!IQ作為回傳值，因為虛假值 like0將是 false，即使對于包含數值的欄位來說這是一個有效值。

const isNumeric = (n) => !isNaN(n - parseFloat(n));

const data = [
  { name: 'Trump', country: 'USA', age: 70, IQ: 150 },
  { name: 'ID Amini', country: 'Uganda', age: 50 },
  { name: 'Kenyatta', country: 'Kenya', age: 60 },
  { name: 'Obama', country: 'USA', age: 45, IQ: 141 },
  { name: 'Foobar', country: 'USA', age: 99, IQ: 0 },
];

const noIq = data.filter(({ IQ }) => !isNumeric(IQ));
console.log(noIq);

const hasIq = data.filter(({ IQ }) => isNumeric(IQ));
console.log(hasIq);

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

一個破碎的例子：

const isNumeric = (n) => !isNaN(n - parseFloat(n));

const data = [
  { name: 'Trump', country: 'USA', age: 70, IQ: 150 },
  { name: 'ID Amini', country: 'Uganda', age: 50 },
  { name: 'Kenyatta', country: 'Kenya', age: 60 },
  { name: 'Obama', country: 'USA', age: 45, IQ: 141 },
  { name: 'Foobar', country: 'USA', age: 99, IQ: 0 },
];

const wrong = data.filter(({ IQ }) => !IQ);

console.log(wrong); // Includes 'Foobar'

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

uj5u.com熱心網友回復：

filter()使用和的各種示例hasOwnProperty()

const data = [
    {
        name: 'Trump',
        country: 'USA',
        age: 70,
        IQ: 140,
    },
    {
        name: 'ID Amini',
        country: 'Uganda',
        age: 50,
    },
    {
        name: 'Kenyatta',
        country: 'Kenya',
        age: 60,
        
    },
    {
        name: 'Obama',
        country: 'USA',
        age: 45,
        IQ: 141
        
    }
]


function doFilter(filter, filterTyped) {
  return data.filter(r => {
    if (filter[0] === 'empty') {
      if (!r.hasOwnProperty(filterTyped)) { return r }
    } else {
      if (r.hasOwnProperty(filterTyped) &&  filter.includes(r[filterTyped])) { return r }
    }
  })
}


let filter = ['empty']
let filterTyped ='IQ'
console.log( doFilter(filter, filterTyped) ) // ID Amini and Kenyatta

filter = [141]
filterTyped ='IQ'
console.log( doFilter(filter, filterTyped) ) // Obama

filter = [140, 141]
filterTyped ='IQ'
console.log( doFilter(filter, filterTyped) ) // Trump and Obama

uj5u.com熱心網友回復：

參考您的代碼段，錯誤是forEach不回傳值。這是一個虛擬代碼，你可以讓它變得更好。

let filter = ['empty']; // passed dynamically u can pass eg Obama, kenyata etc etc
let filterTyped ='IQ' // passed dynamically als here u can pass name, country etc etc

let filteredData = [];
filter.forEach((f) => {
  data.forEach((element) => {
        //return all objects which does not contain IQ if Item is empyt
        if(f === 'empty' && element.IQ === undefined) {
           filteredData.push(element);
        }
    })
})

console.log(filteredData);

標籤：javascriptjQuery数组

上一篇：如何在React中的setState之后渲染組件？

下一篇：typescript宣告中函式屬性的回傳型別