close

[Solved] Typescript error This condition will always return ‘true’ since the types have no overlap

Hello Guys, How are you all? Hope You all Are Fine. Today I get the following error Typescript error This condition will always return ‘true’ since the types have no overlap in javascript. So Here I am Explain to you all the possible solutions here.

Without wasting your time, Let’s start This Article to Solve This Error.

How To Solve Typescript error This condition will always return ‘true’ since the types have no overlap Error ?

  1. How To Solve Typescript error This condition will always return 'true' since the types have no overlap Error?

    To Solve Typescript error This condition will always return 'true' since the types have no overlap Error If frType is Child, the second part will be true, so the expression will evaluate to true. If frType is Infant, then the first part will be true, so the expression will evaluate to true. If frType is neither Child nor Infant, then the first part will be true, and the expression will, again, evaluate to true – the logic is faulty, it'll always resolve to true.

  2. Typescript error This condition will always return 'true' since the types have no overlap

    To Solve Typescript error This condition will always return 'true' since the types have no overlap Error If frType is Child, the second part will be true, so the expression will evaluate to true. If frType is Infant, then the first part will be true, so the expression will evaluate to true. If frType is neither Child nor Infant, then the first part will be true, and the expression will, again, evaluate to true – the logic is faulty, it'll always resolve to true.

Solution 1

Consider the standalone expression:

(this.frType!="Child" || this.frType!="Infant")

If frType is Child, the second part will be true, so the expression will evaluate to true. If frType is Infant, then the first part will be true, so the expression will evaluate to true. If frType is neither Child nor Infant, then the first part will be true, and the expression will, again, evaluate to true – the logic is faulty, it’ll always resolve to true.

(If you add additional || conditions for Grandchild and Cousin, the same thing keeps happening – it’ll always resolve to true)

Either use && instead:

|| (age<=5 && (
   this.frType!="Child" 
   && this.frType!="Infant" 
   && this.frType!="Grandchild"
   && this.frType!="Cousin"
 ))

Or, to make the logic easier to follow, you might consider using an array, and use .includes:

const kidsFiveAndUnder = ['Child', 'Infant', 'Grandchild', 'Cousin'];
// ...
|| (age <= 5 && !kidsFiveAndUnder.includes(this.frType))

Solution 2

In my case the error was triggered by:

*ngIf="fooArray.length === 0"

so I modified it to be:

*ngIf="fooArray.length < 1"

Makes no sense to me, but it works.

Summery

It’s all About this issue. Hope all solution helped you a lot. Comment below Your thoughts and your queries. Also, Comment below which solution worked for you? Thank You.

Also, Read

Leave a Comment