Strict configuration objects in Typescript - Interactive Code Practice

Practice - 5 Tasks

1fill in blank

easy

Complete the code to define a strict configuration object with a required 'url' property.

Typescript

const config: { url: string } = { url: [1] };

Drag options to blanks, or click blank then click option'

A"https://api.example.com"

B12345

Ctrue

Dnull

Attempts:

3 left

💡 Hint

Common Mistakes

Using a number or boolean instead of a string.

Forgetting to put quotes around the URL.

The 'url' property must be a string, so it needs to be enclosed in quotes.

2fill in blank

medium

Complete the code to add an optional 'timeout' property of type number to the configuration object.

Typescript

interface Config {
  url: string;
  timeout[1] number;
}

const config: Config = { url: "https://api.example.com" };

Drag options to blanks, or click blank then click option'

A?:

B? :

C?:=

D:

Attempts:

3 left

💡 Hint

Common Mistakes

Using '? :' with a space between '?' and ':'.

Using ':=' which is not valid syntax.

The optional property syntax in TypeScript uses a question mark before the colon, like timeout?: number;.

3fill in blank

hard

Fix the error in the code by completing the type for the configuration object to prevent extra properties.

Typescript

type Config = {
  url: string;
  timeout?: number;
} & [1];

const config: Config = {
  url: "https://api.example.com",
  timeout: 5000,
  retries: 3
};

Drag options to blanks, or click blank then click option'

ARecord<string, any>

Bunknown

Cnever

Dobject

Attempts:

3 left

💡 Hint

Common Mistakes

Using 'Record' allows any extra properties.

Using 'object' or 'unknown' does not prevent extra properties.

Using & never prevents extra properties by making the type impossible to extend with unknown keys.

4fill in blank

hard

Fill both blanks to create a strict configuration object type that only allows 'url' and 'timeout' properties.

Typescript

type Config = {
  url: string;
  timeout?: number;
} & { [K in keyof [1]]?: never };

const config: Config = { url: "https://api.example.com" };

Drag options to blanks, or click blank then click option'

APartial<Config>

BPick<Config, 'url' | 'timeout'>

CRecord<string, unknown>

DOmit<Config, 'url' | 'timeout'>

Attempts:

3 left

💡 Hint

Common Mistakes

Using 'Record' allows any keys.

Using 'Partial' makes all properties optional but does not forbid extras.

Using Omit gets keys not allowed, and Pick picks allowed keys to forbid others.

5fill in blank

hard

Fill all three blanks to define a strict configuration object with a required 'url', optional 'timeout', and no extra properties allowed.

Typescript

type Config = {
  url: string;
  timeout?: number;
};

const config: Config & [1] = {
  url: "https://api.example.com",
  timeout: 3000,
  [2]: 5,
  [3]: true
};

Drag options to blanks, or click blank then click option'

A{ [key: string]: never }

Bretries

Cdebug

Dextra

Attempts:

3 left

💡 Hint

Common Mistakes

Not using the intersection with '{ [key: string]: never }' to forbid extras.

Adding extra properties without errors.

The intersection with { [key: string]: never } forbids extra properties. The extra keys 'retries' and 'debug' cause errors.