Question: So I have something like this in my react stateful component (I am following some react tutorial)

```
class FullPost extends Component {
  state = {
    loadedpost: null
  }
  componentDidUpdate () {
    if (this.props.id) {
      if (!this.state.loadedpost || this.state.loadedpost && this.state.loadedpost.id !== this.props.id) {
        axios.get("https://jsonplaceholder.typicode.com/posts/" + this.props.id).then(response => {
            this.setState({loadedpost: response.data})
          })
        }
    }
  }

```

In the above code, look at this line

```
 if (!this.state.loadedpost || this.state.loadedpost && this.state.loadedpost.id !== this.props.id) 

```

Here we are saying the code to execute if `this.state.loadedpost` is true and even false? so I thought this check to be unnecessary and hence removed it. this makes my code something like this 

```
if ( this.state.loadedpost.id !== this.props.id) {

```

but this throws an error saying `this.state.loadedpost.id` (actually error is Cannot read property 'id' of null). Which I get it since we don't have anything in this.state.loadedpost.id yet (in our first request) 

**[Question]** But then why isn't the same error not coming when we use the first mentioned code? i.e 

```
  if (!this.state.loadedpost || this.state.loadedpost && this.state.loadedpost.id !== this.props.id) 

```

Answer: 
Because the logical evaluation rules of Javascript, there is a **shortcut**, if the first condition of an `||` is true it doesn't evaluate whatever comes later so the right hand side of the `||` is never evaluated

<https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Logical_Operators>

> 
> As logical expressions are evaluated left to right, they are tested for possible "short-circuit" evaluation using the following rules:
> 
> 
> false && (anything) is short-circuit evaluated to false.
> 
> 
> true || (anything) is short-circuit evaluated to true.
> 
> 
>
Because `if` in optimized way. 

Your `this.state.loadedpost` is `null` so it stops further evaluation:

```
if (!this.state.loadedpost || anythingElse) -> if (true || anythingElse)

```