I have an array of objects:
[
{
"id": "1",
"LB1": "Kod produktu: PMPSB216IN80",
"Type": "Figurki"
},
{
"id": "2",
"Type": "Głowa Do Stylizacji"
},
{
"id": "3",
"LB1": "Kod produktu: 97834",
"Type": "Pluszak"
},
]
Than I'm defining a string: '97834'
And I want to filter the array based on LB1 value:
filteredProducts = productList.filter(product => product.LB1.replace('Kod produktu: ', '').toLowerCase() === this.props.searchTerm.toLowerCase());
However as you can see above - not all objects contain this LB1 - and the function is throwing an error:
Test.js:101 Uncaught TypeError: Cannot read properties of undefined (reading 'replace')
Check to see if LB1 exists - if it doesn't, filter it out as if it didn't match your search term (here I'm using logical AND:
filteredProducts = productList.filter(product => product.LB1 != null && product.LB1.replace('Kod produktu: ', '').toLowerCase() === this.props.searchTerm.toLowerCase());
You could add a condition, in your filter function, that checks for the existance of that property. Here, i'm using the in operator, to validate just that.
const productList = [
{
"id": "1",
"LB1": "Kod produktu: PMPSB216IN80",
"Type": "Figurki"
},
{
"id": "2",
"Type": "Głowa Do Stylizacji"
},
{
"id": "3",
"LB1": "Kod produktu: 97834",
"Type": "Pluszak"
},
]
const searchTerm = '97834' /* this.props.searchTerm.toLowerCase() */;
const filteredProducts = productList.filter(product => 'LB1' in product && product.LB1.replace('Kod produktu: ', '').toLowerCase() === searchTerm );
console.log('output', filteredProducts);