CodeBlanks Logo Icon CodeBlanks

in operator

Learn narrowing by property with the in operator.

in operator

The in operator checks whether a property exists on an object. A check like "swim" in animal lets TypeScript narrow a union type; if the property exists only on one member, the object is narrowed to that member's type inside the block.

interface Fish { swim(): void }
interface Bird { fly(): void }

function move(animal: Fish | Bird) {
  if ("swim" in animal) {
    animal.swim();  // Fish
  } else {
    animal.fly();  // Bird
  }
}

Distinguishing object shapes

The in operator is ideal for distinguishing objects that have different fields rather than a common one. If each member has a unique property, checking it with in narrows the type. Discriminated unions use a common kind field, but in is more flexible.

interface Square { size: number }
interface Circle { radius: number }

function area(shape: Square | Circle): number {
  if ("radius" in shape) {
    return Math.PI * shape.radius ** 2;  // Circle
  }
  return shape.size ** 2;  // Square
}

Practice Separate shapes with in

Define Square (size: number) and Circle (radius: number) interfaces. Write an area(shape: Square | Circle): number function. If "radius" in shape, return Math.PI * shape.radius ** 2; otherwise return shape.size ** 2. Print results via console.log(area({ size: 5 })) and console.log(area({ radius: 2 })).

Starter code

index.ts
// Square (size: number) interface tanımla

// Circle (radius: number) interface tanımla

// area(shape: Square | Circle) fonksiyonunu in ile yaz

// area({ size: 5 }) ve area({ radius: 2 }) sonuçlarını yazdır

Sample solution

index.ts
interface Square { size: number; }
interface Circle { radius: number; }

function area(shape: Square | Circle): number {
  if ("radius" in shape) {
    return Math.PI * shape.radius ** 2;
  }
  return shape.size ** 2;
}

console.log(area({ size: 5 }));
console.log(area({ radius: 2 }));

Expected output

25
12.566370614359172

Questions and answers

Review the lesson questions together with their answers. To test yourself, solve the lesson interactively.

1 What does the in operator check?

  • The type of a value
  • The superclass of a class
  • Whether a property exists on an object Correct answer
  • Whether two objects have the same shape

Explanation: The in operator returns whether the property on the left exists on the object on the right; this is used to distinguish members of a union that have different shapes.

2 Property check with in

Question
interface Fish { swim(): void }
interface Bird { fly(): void }

function move(a: Fish | Bird) {
  if (____) {
    a.swim();
  } else {
    a.fly();
  }
}
Answer
interface Fish { swim(): void }
interface Bird { fly(): void }

function move(a: Fish | Bird) {
  if ("swim" in a) {
    a.swim();
  } else {
    a.fly();
  }
}

Explanation: The in operator checks whether the "swim" property exists on the object; since the property is only on Fish, a is narrowed to Fish inside the condition.

3 in operator parts

Term Meaning
in operatörü property exists on object
"swim" in animal narrows to Fish member
interface defines object shape
Discriminated union distinguish via common kind field

All lessons in Advanced