If clause in a React return statement with

Question

So I'm making a React program that's about sports. In there I have a table that shows user inputs and those are saved in Firebase realtime database. I'm getting the data from the database and showing it in the table, but I have to make some calculations with those inputs. If the user for example hasn't filled some fields, the end "Total score" will show as NaN because in my calculation the first thing will b 0-x and that makes it NaN.
table example

I have tried making a function for calculating the points outside or the return and then I possibly could call it out but Im not really sure how to access the data cause the database thing kinda makes it difficult for me. My code snippets are down here

Separate calculation.

const hundredPoints = () => {
        var number = 0;
        let result = decathletes.map(a => a.hundredMeters);
        if(result === '') 
        {number += 0
        } else if(result < 9.5 || result > 20) {
          number += 0;
        } else {
          number += Math.floor(hundred.hundredMeters.a*Math.pow((hundred.hundredMeters.b-Number(result)), hundred.hundredMeters.c))
        } 
        console.log(number);
        return number;
      } 

My array where I add them database object locally.

const [decathletes, setDecathletes] = useState([])
  useEffect(() => {
    getDecathletes()
  }, [])

  function getDecathletes() {
    const decathletesCollectionRef = collection(db, 'decaTable');
    getDocs(decathletesCollectionRef)
      .then(response => {
        const deca = response.docs.map(doc => ({ data: doc.data(), id: doc.id }))
        setDecathletes(deca)
        console.log(q)
      })
      .catch(e => console.log(e.message));

  }

The Table in the return statement

      < Table>
        <Fragment>
          <div>
            <thead>
              <tr>
                <th>Name</th>
                <th>Date of birth</th>
                <th>100m</th>
                <th>Long</th>
                <th>Shot  Put</th>
                <th>Total score</th>
              </tr>
            </thead>
            <tbody>
              {decathletes.map((decas) => (<tr>
                <td key={decas.id}>{decas.data.name}</td>
                <td key={decas.id}>{decas.data.dateOfBirth}</td>
                <td key={decas.id}>{decas.data.hundredMeters}</td>
                <td key={decas.id}>{decas.data.longJump}</td>
                <td key={decas.id}>{decas.data.shotPut}</td>
                <td key={decas.id}>{Number(Math.floor(hundred.hundredMeters.a * Math.pow((hundred.hundredMeters.b - Number(decas.data.hundredMeters)), hundred.hundredMeters.c))) +
                  Number(Math.floor(long.longJump.a * Math.pow(Number(decas.data.longJump) * 100 - long.longJump.b, long.longJump.c))) +
                  Number(Math.floor(shot.shotPut.a * Math.pow((Number(decas.data.shotPut - shot.shotPut.b)), shot.shotPut.c)))}</td>
                </tr>))}
            </tbody>
          </div>
        </Fragment>
      </Table>

If anyone can help, I'd appreciate it immensely, my own brain cant figure it out anymore although it might be really obvious. :D