Fresh object literals vs variable assignment behavior in Typescript - Quick Revision & Key Differences

Recall & Review

beginner

What is a fresh object literal in TypeScript?

A fresh object literal is a newly created object directly written in the code, which TypeScript treats with exact property checks during type assignment.

intermediate

How does TypeScript treat object literals differently from variables when assigning to a typed variable?

TypeScript performs strict property checks on fresh object literals, disallowing extra properties. Variables assigned to objects are treated as non-fresh, so extra properties are allowed if the target type is compatible.

intermediate

Why does TypeScript sometimes give an error for extra properties in object literals but not for variables?

Because fresh object literals are checked strictly for extra properties to catch mistakes early, while variables are assumed to be intentionally typed and allow extra properties if compatible.

beginner

What happens if you assign a fresh object literal with extra properties to a variable typed with fewer properties?

TypeScript will give an error about excess properties because fresh object literals are checked strictly for extra properties not in the target type.

intermediate

How can you avoid excess property errors when assigning fresh object literals in TypeScript?

You can assign the object literal to a variable first, then assign that variable to the typed variable, or use type assertions to tell TypeScript to trust the type.

What does TypeScript call an object created directly in the code with properties listed inside curly braces?

A Class instance

B Variable object

C Fresh object literal

D Function object

An object created directly with curly braces and properties is called a fresh object literal in TypeScript.

Why does TypeScript give an error when assigning an object literal with extra properties to a typed variable?

A Because variables cannot have extra properties

B Because the object literal is missing required properties

C Because TypeScript does not allow any object assignments

D Because fresh object literals are checked strictly for extra properties

TypeScript performs excess property checks on fresh object literals to catch mistakes early.

How can you assign an object with extra properties to a typed variable without error?

A Assign the object literal to a variable first, then assign that variable

B Use a class instead of an object literal

C Remove all properties from the object

D Use a function to create the object

Assigning the object literal to a variable first makes it non-fresh, so TypeScript allows extra properties.

What is the main difference between fresh object literals and variables in TypeScript type checking?

A Variables are checked strictly; fresh object literals are not

B Fresh object literals are checked strictly for extra properties; variables are not

C Both are treated exactly the same

D Variables cannot be assigned to typed variables

Fresh object literals get excess property checks, while variables do not.

Which of these is a valid way to silence excess property errors in TypeScript?

A Use a type assertion like 'as Type'

B Add extra properties to the type

C Use a different programming language

D Remove the type annotation

Using a type assertion tells TypeScript to trust the type and skip excess property checks.

Explain the difference between fresh object literals and variables in TypeScript when assigning to typed variables.

Think about how TypeScript checks extra properties differently for direct objects vs variables.

Describe two ways to avoid excess property errors when assigning objects in TypeScript.

Consider how TypeScript treats fresh vs non-fresh objects and how assertions affect checking.

Practice

1. In TypeScript, what happens when you assign an object variable to another variable using let b = a;?

easy

A. The original object is deleted.

B. A new copy of the object is created.

C. The object is converted to a string.

D. Both variables point to the same object in memory.

Solution

1. Step 1: Understand variable assignment with objects

   Assigning one object variable to another copies the reference, not the object itself.

2. Step 2: Effect of reference copying

   Both variables now point to the same object in memory, so changes via one affect the other.

3. Final Answer:

   Both variables point to the same object in memory. -> Option D

4. Quick Check:

   Object assignment copies reference = A [OK]

Hint: Assigning objects copies references, not objects themselves [OK]

Common Mistakes:

• Thinking a new object is created on assignment
• Assuming variables hold independent copies
• Confusing object assignment with primitive assignment

2. Which of the following is the correct way to create a fresh object literal in TypeScript?

easy

A. let obj = obj2;

B. let obj = Object.assign({});

C. let obj = { name: 'Alice' };

D. let obj = new Object(obj2);

Solution

1. Step 1: Identify fresh object literal syntax

   Using curly braces {} creates a new, fresh object literal.

2. Step 2: Check other options

   let obj = Object.assign({}); is incorrect because Object.assign({}) needs a source object to copy from; let obj = obj2; copies reference; let obj = new Object(obj2); creates an object but with a reference or unexpected behavior.

3. Final Answer:

   let obj = { name: 'Alice' }; -> Option C

4. Quick Check:

   Fresh object literal uses {} = A [OK]

Hint: Use curly braces {} to create fresh objects [OK]

Common Mistakes:

• Using assignment to copy objects instead of fresh literals
• Misusing Object.assign without source
• Confusing new Object() with fresh literal

3. What will be the output of this TypeScript code?

let a = { x: 1 };
let b = a;
b.x = 5;
console.log(a.x);

medium

A. 1

B. 5

C. undefined

D. Error

Solution

1. Step 1: Understand reference assignment

   Variable b points to the same object as a.

2. Step 2: Modify property via b

   Changing b.x to 5 changes the shared object property.

3. Step 3: Log a.x

   Since a and b reference the same object, a.x is now 5.

4. Final Answer:

   5 -> Option B

5. Quick Check:

   Shared reference means change visible = B [OK]

Hint: Changing one reference changes all pointing to same object [OK]

Common Mistakes:

• Expecting original object to remain unchanged
• Confusing object copying with reference assignment
• Assuming primitive copy behavior for objects

4. Identify the bug in this TypeScript code snippet:

let obj1 = { val: 10 };
let obj2 = obj1;
obj2 = { val: 20 };
console.log(obj1.val);

medium

A. obj2 assignment creates a new object, obj1 remains unchanged.

B. Both obj1 and obj2 point to the new object.

C. Syntax error due to reassignment.

D. obj1.val will be 20, which is unexpected.

Solution

1. Step 1: Analyze initial assignment

   obj2 initially points to the same object as obj1.

2. Step 2: Reassign obj2 to a new object

   obj2 now points to a fresh object; obj1 still points to the original.

3. Step 3: Check console output

   obj1.val remains 10 because obj1's reference did not change.

4. Final Answer:

   obj2 assignment creates a new object, obj1 remains unchanged. -> Option A

5. Quick Check:

   Reassignment changes reference, original unaffected = D [OK]

Hint: Reassigning variable changes reference, original object stays same [OK]

Common Mistakes:

• Thinking obj1 changes when obj2 is reassigned
• Confusing property change with variable reassignment
• Expecting both variables to point to new object

5. You want to create two independent objects in TypeScript so that changing one does not affect the other. Which code snippet achieves this correctly?

const obj1 = { a: 1 };
const obj2 = ???
obj2.a = 5;
console.log(obj1.a);

hard

A. obj2 = { ...obj1 };

B. obj2 = Object.assign(obj1);

C. obj2 = obj1;

D. obj2 = obj1 as any;

Solution

1. Step 1: Understand shallow copy with spread operator

   Using { ...obj1 } creates a fresh object with copied properties.

2. Step 2: Check other options

   obj2 = obj1; copies reference; obj2 = Object.assign(obj1); is incorrect usage of Object.assign; obj2 = obj1 as any; is just a type assertion, no copy.

3. Step 3: Confirm independence

   Changing obj2.a does not affect obj1.a.

4. Final Answer:

   obj2 = { ...obj1 }; -> Option A

5. Quick Check:

   Spread operator creates fresh object copy = C [OK]

Hint: Use spread {...obj} to copy objects independently [OK]

Common Mistakes:

• Assigning reference instead of copying
• Misusing Object.assign without target
• Confusing type assertion with copying