Global augmentation in Typescript - Cheat Sheet & Quick Revision

Recall & Review

beginner

What is global augmentation in TypeScript?

Global augmentation means adding new types or members to existing global types or modules, so they are available everywhere in your project.

beginner

How do you declare a global augmentation in TypeScript?

You use the declare global block inside a module to add or extend global types or interfaces.

intermediate

Why use global augmentation instead of creating new types?

Global augmentation lets you extend existing types without rewriting or duplicating them, making your code more consistent and easier to maintain.

intermediate

What is the difference between module augmentation and global augmentation?

Module augmentation adds or changes types inside a specific module, while global augmentation changes types available everywhere in the project.

beginner

Show a simple example of global augmentation adding a property to the Window interface.

export {}; declare global { interface Window { myCustomProperty: string; } } window.myCustomProperty = "Hello!"; console.log(window.myCustomProperty); // Outputs: Hello!

Which keyword is used to start a global augmentation block in TypeScript?

A global declare

B declare global

C augment global

D module global

The correct syntax to start a global augmentation is using declare global.

Global augmentation is useful for:

A Importing external modules

B Creating new unrelated types

C Adding new properties to existing global types

D Changing JavaScript runtime behavior

Global augmentation lets you add or extend properties on existing global types, not create unrelated types or change runtime behavior.

Where should you place a global augmentation in your TypeScript project?

A In a CSS file

B In a JavaScript file

C In the main HTML file

D Inside a module file with <code>export {}</code>

Global augmentation must be inside a module file, so you usually add export {} to make the file a module.

What happens if you forget to add export {} in a global augmentation file?

A The file is treated as a script, and augmentation may not work correctly

B The augmentation works perfectly

C TypeScript throws a syntax error

D The file is ignored by the compiler

Without export {}, the file is a script, not a module, so global augmentation may not be recognized properly.

Which of these is a valid use of global augmentation?

A Adding a new method to the Array interface globally

B Changing the behavior of console.log

C Adding a new HTML tag

D Modifying CSS styles

You can add new methods or properties to global interfaces like Array using global augmentation.

Explain how to add a new property to the Window interface globally in TypeScript.

Think about using 'declare global' and interface extension.

Describe the difference between global augmentation and module augmentation in TypeScript.

Consider where the types are available after augmentation.