• Jobs
  • About Us
  • professionals
    • Home
    • Jobs
    • Courses and challenges
  • business
    • Home
    • Post vacancy
    • Our process
    • Pricing
    • Assessments
    • Payroll
    • Blog
    • Sales
    • Salary Calculator

0

111
Views
How to tell if the list is empty using "filter" and "map"
      list
        .filter((val) => {
          if (
            val.name.toLocaleLowerCase().includes(input))
          ) {
            return val
          }
        })
        .map((val, idx) => (
          <Li
            key={idx}
          />
        ))

Using this structure, I wanted to do something if returns empty.

Ex: When searching for "abc" and there is no "abc" in the list, a message appears saying that "abc" was not found.

almost 3 years ago · Juan Pablo Isaza
2 answers
Answer question

0

Several things to change:

1. Your filter expression is only working by accident

list
    .filter((val) => {
      if (
        val.name.toLocaleLowerCase().includes(input))
      ) {
        return val
      }
    })

can be just

list
    .filter(val => val.name.toLocaleLowerCase().includes(input)

Remember that the function inside filter just returns a true or false. By chance your expression, which returns the actual list element, is interpreted as true, and when your expression does not match, you don't return anything, which has the same effect as returning false. Expressing it as above makes it clearer what you are doing (and is very marginally faster).

2. To get your error message, save the output of the filter so you can test its length.

const matches = list.filter(val => val.name.toLocaleLowerCase().includes(input)

const output =  (matches.length>0) ? 
    matches.map((val, idx) => (
      <Li
        key={idx}
      />
    )) : (
      <div>Not found</div>
    )
almost 3 years ago · Juan Pablo Isaza Report

0

You can tell if the list is empty using "filter" and "map" by using following JavaScript Code:

list
.filter((value) => (value!==undefined) && (value!==null) && value.name.toLocaleLowerCase().includes(input)))
.map((value, id) => (
          <Li
            key={id}
          />
))
almost 3 years ago · Juan Pablo Isaza Report
Answer question
Find remote jobs

Discover the new way to find a job!

Top jobs
Top job categories
Business
Post vacancy Pricing Our process Sales
Legal
Terms and conditions Privacy policy
© 2025 PeakU Inc. All Rights Reserved.

Andres GPT

Recommend me some offers
I have an error