reactjs - What does '&&' operator indicate with { this.props.children && React.cloneElement(this.props.children, { foo:this.foo})

Question

I have react class that is rendered using react router. I understand that React.cloneElement is used to pass elements from parent to child. But why/what does the '&&' operator do with this kind of statement :

class Users extends React.Component {
    getInitialState() {
      return {
          page:0
        }
     },      
    foo(){
        this.setState({'page':1})
     }
      render() {
        return (
          <div>
            <h2>Users</h2>
            { this.props.children && React.cloneElement(this.props.children, {
    foo:this.foo})
          </div>
        )
      }
    }

I would like to understand why are we using '&&' operator here.

Answer 1

It's Short circuit evaluation

(if this part is true) && (this part will execute)

And it shorthand of:

if(condition){
   (this part will execute)
}