0
0
Typescriptprogramming~20 mins

Excess property checking behavior in Typescript - Practice Problems & Coding Challenges

Choose your learning style9 modes available
LearnWhyDeepVisualTryChallengeProjectRecallTime
Challenge - 5 Problems
🎖️
Excess Property Master
Get all challenges correct to earn this badge!
Test your skills under time pressure!
❓ Predict Output
intermediate
2:00remaining
What is the output of this TypeScript code with excess property?
Consider the following TypeScript code snippet. What will be the output when compiled and run with strict excess property checking enabled?
Typescript
interface Person {
  name: string;
  age: number;
}

const p: Person = { name: "Alice", age: 30, location: "NY" };
console.log(p);
ACompilation warning but code runs and prints { name: 'Alice', age: 30 }
B{ name: 'Alice', age: 30, location: 'NY' } printed to console
CCompilation error: Object literal may only specify known properties, and 'location' does not exist in type 'Person'.
DRuntime error: Property 'location' is not defined on type 'Person'.
Attempts:
2 left
💡 Hint
Think about how TypeScript treats extra properties in object literals assigned to typed variables.
❓ Predict Output
intermediate
2:00remaining
What happens when assigning an object with excess properties via a variable?
Given this TypeScript code, what will be the output or error?
Typescript
interface Car {
  make: string;
  year: number;
}

const obj = { make: "Toyota", year: 2020, color: "red" };
const myCar: Car = obj;
console.log(myCar);
ARuntime error: 'color' property not allowed on type 'Car'.
BCompilation error due to excess property 'color'.
C{ make: 'Toyota', year: 2020 } printed to console, 'color' ignored.
D{ make: 'Toyota', year: 2020, color: 'red' } printed to console.
Attempts:
2 left
💡 Hint
Excess property checking applies only to object literals assigned directly to typed variables.
🔧 Debug
advanced
2:00remaining
Why does this TypeScript code cause an error with excess properties?
Identify the cause of the error in this code and select the correct explanation.
Typescript
interface Book {
  title: string;
  author: string;
}

function printBook(book: Book) {
  console.log(`${book.title} by ${book.author}`);
}

printBook({ title: "1984", author: "Orwell", pages: 328 });
AError because 'pages' is missing in the 'Book' interface.
BError because 'pages' is an excess property not defined in 'Book' interface.
CNo error; extra properties are allowed in function arguments.
DError because 'title' and 'author' are missing in the object.
Attempts:
2 left
💡 Hint
Check how TypeScript treats object literals passed directly as function arguments.
📝 Syntax
advanced
2:00remaining
Which option correctly bypasses excess property checking in TypeScript?
You want to assign an object with extra properties to a typed variable without error. Which option achieves this?
Typescript
interface User {
  username: string;
  email: string;
}

const user = { username: "john", email: "john@example.com", age: 25 };
Aconst u: User = user as User; // no error
Bconst u: User = { ...user }; // no error
Cconst u: User = user; // no error
Dconst u: User = { username: user.username, email: user.email }; // no error
Attempts:
2 left
💡 Hint
Type assertion can bypass excess property checks.
🚀 Application
expert
2:00remaining
How many properties does the resulting object have after this code runs?
Analyze the following TypeScript code and determine how many properties the final object 'result' has.
Typescript
interface Config {
  host: string;
  port: number;
}

const extra = { port: 8080, protocol: "https" };
const config: Config = { host: "localhost", ...extra };
const result = config;
ACompilation error due to excess property 'protocol'
B3 properties: 'host', 'port', and 'protocol'
C1 property: 'host' only
D2 properties: 'host' and 'port'
Attempts:
2 left
💡 Hint
Excess property checking applies to object literals, including properties from spread operators if they introduce unknown properties.