javascript - recursion method returning undefined

Question

I'm writing something where you can generate a random number, and it checks if its in an array, if it is, it generates a different one until a unique is found and adds that into the array and so on. For some reason it returns undefined after recursively running itself. why?

returning 2 index.js:26 retrieved 2

index.js:26 found a duplicate 2

index.js:26 returning 1

index.js:26 retrieved undefined

 import React from "react"; import ReactDOM from "react-dom"; import "./styles.css"; const MAX = 3; class Clickity extends React.Component { constructor(props) { super(props); this.state = { numbers: [] } } generateRand = () => { // generate a random number 1 - MAX (3) let rand = Math.floor(Math.random() * MAX + 1); let { numbers } = this.state; // if length of array is equal to max return 0 if (numbers.length === MAX) return 0; // check if generated number is in array if (numbers.includes(rand)) { console.log(`found a duplicate ${rand}`) // recursively run method this.generateRand(); } else { // return the random number console.log(`returning ${rand}`) return rand; } } addNewNumber = () => { let id = this.generateRand(); console.log(`retrieved ${id}`) let { numbers } = this.state; numbers.push(id); this.setState({ numbers }); } render() { return ( <div> <a onClick={() => this.addNewNumber()}>Generate unique number</a> <ul>{this.state.numbers.map((num) => <li>{num}</li>)}</ul> </div> ) } } function App() { return ( <Clickity /> ); } const rootElement = document.getElementById("root"); ReactDOM.render(<App />, rootElement); 

Answer 1

您不return this.generateRand()