Heil Programmierung
Heil Programmierung

Reputation: 187

How can I do type-guarding for the same object?

For example, I have such a code:

interface Subscriber {
  reviewData: string | string[]
  hasArray: boolean;
}

const reviews = ["Good", "Not bad"];

const subscriber: Subscriber = {
  reviewData: reviews,
  hasArray: Array.isArray(reviews)
}

if (subscriber.hasArray) {
  subscriber.reviewData.forEach(console.log);
} else {
  console.log(subscriber.reviewData);
}

Of course, TypeScript will complain at subscriber.reviewData.forEach(console.log); saying that it can't define whether it's an array or just a string because there's not enough type guarding in the condition subscriber.hasArray.

I don't want to always write Array.isArray(subscriber.reviewData) because I'm gonna use this logic in many other places.

I've heard of is but that's not really the case in my scenario because using is implies you have to have a function and pass some argument into it.

How can I achieve the desired result?

Upvotes: 1

Views: 41

Answers (1)

jcalz
jcalz

Reputation: 329523

If you want to be able to use hasArray as a way to determine if reviewData is a string[] or a string, then you really want Subscriber to be a discriminated union type instead of an interface. Your interface would allow {reviewData: "", hasArray: true}, and so the compiler cannot discount the possibility. With a discriminated union you can have a discriminant property that you check in order to narrow the type of the whole object:

type Subscriber = {
    reviewData: string[]
    hasArray: true;
} | {
    reviewData: string
    hasArray: false;
}

In this case hasArray is the discriminant property of a boolean literal type true or false.

Then, given a Subscriber:

const subscriber: Subscriber = Math.random() < 0.5 ?
    { reviewData: "Good", hasArray: false } :
    { reviewData: ["Who", "Cares"], hasArray: true };

We can check it the way you want without compiler error:

if (subscriber.hasArray) {
    subscriber.reviewData.forEach(console.log);
} else {
    console.log(subscriber.reviewData.toUpperCase());
}

Playground link to code

Upvotes: 1

Related Questions