What structural typing means in Typescript - Practice Problems & Coding Challenges

Challenge - 5 Problems

🧠 Conceptual

intermediate

Understanding Structural Typing in TypeScript

Which statement best describes what structural typing means in TypeScript?

A Types are compatible if their structures (properties and methods) match, regardless of explicit declarations.

B Types must have the same name to be considered compatible.

C Type compatibility depends on inheritance hierarchy only.

D Types are checked only at runtime, not during compilation.

💡 Hint

Think about how TypeScript compares objects based on their shape, not their names.

Structural typing means that TypeScript checks if types have the same shape (properties and methods) to decide compatibility, ignoring explicit names or inheritance.

❓ Predict Output

intermediate

Output of Structural Typing Example

What is the output of this TypeScript code?

Typescript

interface Point { x: number; y: number; }

function printPoint(p: Point) {
  console.log(`x: ${p.x}, y: ${p.y}`);
}

const pointLike = { x: 10, y: 20, z: 30 };
printPoint(pointLike);

A Runtime error: Property 'x' is undefined.

B x: 10, y: 20

C Type error: Argument of type '{ x: number; y: number; z: number; }' is not assignable to parameter of type 'Point'.

D x: 10, y: 20, z: 30

💡 Hint

Remember TypeScript allows extra properties when passing objects if required properties exist.

The object has at least the properties x and y required by Point, so it is accepted. Extra properties like z are ignored.

🔧 Debug

advanced

Why does this TypeScript code cause an error?

Consider this code snippet. Why does it cause a TypeScript error?

Typescript

interface Animal { name: string; }
interface Dog extends Animal { bark(): void; }

function makeAnimalBark(animal: Dog) {
  animal.bark();
}

const myAnimal = { name: 'Buddy' };
makeAnimalBark(myAnimal);

A No error; structural typing allows this call.

B Error because 'myAnimal' has extra properties not in 'Dog'.

C Error because 'myAnimal' lacks the 'bark' method required by 'Dog'.

D Error because 'Animal' and 'Dog' are unrelated types.

💡 Hint

Check if the object passed has all required properties and methods.

Structural typing requires the object to have all properties and methods of the target type. 'myAnimal' lacks 'bark', so it causes an error.

📝 Syntax

advanced

Which TypeScript code correctly demonstrates structural typing?

Choose the code snippet that correctly uses structural typing to assign one object to another type.

A

type A = { id: number };
type B = { id: number; name: string };
const a: A = { id: 1 };
const b: B = a;

B

type A = { id: number };
type B = { id: number; name: string };
const b: B = { id: 1, name: 'Test' };
const a: A = b;

C

interface A { id: number; }
interface B { id: number; name: string; }
const a: A = { id: 1 };
const b: B = a;

D

interface A { id: number; }
interface B { id: number; name: string; }
const b: B = { id: 1, name: 'Test' };
const a: A = b;

💡 Hint

Remember that a type with more properties can be assigned to a type with fewer properties if the required ones match.

Option D assigns a bigger type (B) to a smaller type (A), which is allowed by structural typing. Other options either assign smaller to bigger or have errors.

🚀 Application

expert

Predict the output of this structural typing example with functions

What will be the output when running this TypeScript code?

Typescript

type FuncA = (x: number) => number;
type FuncB = (x: number, y: number) => number;

const f1: FuncA = (x) => x * 2;
const f2: FuncB = (x, y) => x + y;

const test1: FuncA = f2;
const test2: FuncB = f1;

console.log(test1(5));
console.log(test2(5, 10));

A Type error at compile time assigning f1 to FuncB.

B

10
TypeError at runtime because test2 expects two arguments but f1 only uses one.

C Type error at compile time assigning f2 to FuncA.

D

10
15

💡 Hint

Think about function parameter compatibility in structural typing.

In TypeScript, a function with fewer parameters can be assigned to a type expecting more parameters, but not vice versa. Assigning f1 (one param) to FuncB (two params) causes a compile error.