Key remapping with as clause in Typescript - Interactive Code Practice

Practice - 5 Tasks

1fill in blank

easy

Complete the code to rename the key 'name' to 'fullName' in the object.

Typescript

const person = { name: 'Alice', age: 30 };
const { name: [1] } = person;
console.log(fullName);

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

AfullName

Bname

CpersonName

DuserName

Attempts:

3 left

💡 Hint

Common Mistakes

Using the same key name without renaming, which keeps the original variable name.

Trying to rename without the colon syntax.

Using name: fullName renames the key name to fullName when destructuring.

2fill in blank

medium

Complete the code to rename the key 'age' to 'years' when destructuring.

Typescript

const user = { age: 25, city: 'NY' };
const { age: [1] } = user;
console.log(years);

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

AageYears

BuserAge

Cyears

Dage

Attempts:

3 left

💡 Hint

Common Mistakes

Using the original key name instead of the new variable name.

Forgetting the colon between old and new key names.

The syntax age: years renames the age property to years in the destructured variable.

3fill in blank

hard

Fix the error in the destructuring assignment to rename 'title' to 'bookTitle'.

Typescript

const book = { title: '1984', author: 'Orwell' };
const { [1] } = book;
console.log(bookTitle);

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

Atitle: bookTitle

Btitle

CbookTitle

Dtitle as bookTitle

Attempts:

3 left

💡 Hint

Common Mistakes

Using 'as' instead of colon for renaming.

Not renaming and just using the original key name.

The correct syntax to rename a key during destructuring is oldKey: newKey. So title: bookTitle is correct.

4fill in blank

hard

Fill both blanks to rename 'firstName' to 'name' and 'birthYear' to 'year' in the object.

Typescript

const person = { firstName: 'John', birthYear: 1990 };
const { [1], [2] } = person;
console.log(name, year);

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

AfirstName: name

BbirthYear: year

CfirstName

DbirthYear

Attempts:

3 left

💡 Hint

Common Mistakes

Not renaming keys and using original names.

Mixing up the order of keys.

Use firstName: name and birthYear: year to rename keys during destructuring.

5fill in blank

hard

Fill all three blanks to rename keys 'a' to 'alpha', 'b' to 'beta', and 'c' to 'gamma' in the object.

Typescript

const obj = { a: 1, b: 2, c: 3 };
const { [1], [2], [3] } = obj;
console.log(alpha, beta, gamma);

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

Aa: alpha

Bb: beta

Cc: gamma

Da

Attempts:

3 left

💡 Hint

Common Mistakes

Using original keys without renaming.

Using invalid syntax like 'as' for renaming.

Each key is renamed using oldKey: newKey syntax during destructuring.