Home > Enterprise >  cannot read property of undefined using default value
cannot read property of undefined using default value

Time:11-05

I have a model that gets some data and filters. When the app starts I want to have all filters equal to true. I have set a default value but I still get the following error.

const model = (data, predictions, { placeFilter = true, startDateFilter = true, endDateFilter = true }) => {
   const getData = () => data.filter(placeFilter).filter(startDateFilter).filter(endDateFilter)
}
TypeError: Cannot read properties of undefined (reading 'placeFilter')
    at model (model.js:1)
    at init (index.js:15)

CodePudding user response:

const model = (data, predictions, { placeFilter = true, startDateFilter = true, endDateFilter = true }) => {
   const getData = () => data.filter(placeFilter).filter(startDateFilter).filter(endDateFilter)
}

You cannot call the above model function by passing two arguments like model([], []) as JavaScript will try to destructure the third argument which is undefined.

You can do this instead:

const model = (data, predictions, { placeFilter = true, startDateFilter = true, endDateFilter = true } = {}) => {
  console.log(placeFilter, startDateFilter, endDateFilter)
}

model([], [])
model([], [], { placeFilter: false })
<iframe name="sif1" sandbox="allow-forms allow-modals allow-scripts" frameborder="0"></iframe>


BTW Assuming data is an array and you're trying to use Array.prototype.filter, filter should be called with a callback function that returns a boolean but you're directly passing booleans to all filters.

CodePudding user response:

Your parameter could be named to access the default value

const model = (data, predictions, filter = { placeFilter: true, startDateFilter: true, endDateFilter:  true }) => {
   const getData = () => data.filter(filter.placeFilter).filter(filter.startDateFilter).filter(filter.endDateFilter)
}

CodePudding user response:

const model = (data, predictions, { placeFilter = true, startDateFilter = true, endDateFilter = true } = {}) => {
  const getData = () => data.filter(placeFilter).filter(startDateFilter).filter(endDateFilter)
}
<iframe name="sif2" sandbox="allow-forms allow-modals allow-scripts" frameborder="0"></iframe>

  • Related