When you have mutliple types and you want to create a type that is the union of them, you can give them all a shared property where reach type has its own type for it and then discriminate based on that type.

interface Fruit {
  name: string;
  color: string;
  juice: () => void;
}

interface Vegetable {
  name: string;
  color: string;
  steam: () => void;
}

type EdibleThing = Fruit | Vegetable;

function prepareEdibleThing(food: EdibleThing) {
  food.juice();
  // Type Error: Property 'juice' does not exist on type 'EdibleThing'.
  //    Property 'juice' does not exist on type 'Vegetable'.
}

function prepareEdibleThing(food: EdibleThing) {
  if ("juice" in food) {
    food.juice();
  }
}

Or use Discriminating Unions, add a literal type to the interfaces which are part of the union. Then we can check that individual property to see what type represents the value:

interface Fruit {
  type: "fruit";
  name: string;
  color: string;
  juice: () => void;
}

interface Vegetable {
  type: "vegetable";
  name: string;
  color: string;
  steam: () => void;
}

type EdibleThing = Fruit | Vegetable;

function prepareEdibleThing(food: EdibleThing) {
  if (food.type === "fruit") {
    food.juice();
  }
  if (food.type === "vegetable") {
    food.steam();
  }
}

This only works because all of the members of the Union have a similar property, but the property doesn't have to be a literal type. As long as the type is different for each of the members, we can check against it. For example, TypeScript's type checker is intelligent enough to determine the type when we use a truthiness check on a member that could be null.

type StringResult =
  | { error: Error; data: null }
  | { error: null; data: string };

function handleResult(result: StringResult) {
  if (result.error) {
    // Handle the error, which we know is an Error type
  }

  return result.data;
}