JavaScript's "True/false && expression" logical expression

True/false && Expression

In the course of learning react, we encountered one of the following methods:

function Mailbox (props) {  const unreadmessages = props.unreadmessages;  Return (    <div>      
In this method, the number of unread messages Unreadmessages is defined
And then return a piece of code that reminds you how many unread messages you have.
The Core code:
0 &&    {unreadmessages.length} unread messages. 
&& the expression on the left determines whether the number of messages is greater than 0, and how many unread messages are in the right-hand expression rendering;
 
   
This is possible because in JavaScripttrue && expressionAlways return expressionfalse && expressionAlways returns FALSE. If the condition is true,&& the right side of the element will be rendered if false,react ignores and skips it.
JavaScript's "True/false && expression" logical expression