Declaring global variables in Typescript - Step-by-Step Execution

Concept Flow - Declaring global variables

Start Program

↓

Declare global variable

↓

Use global variable in functions or blocks

↓

Modify or read global variable

↓

Program ends

The program starts by declaring a global variable accessible everywhere, then uses or modifies it inside functions or blocks before ending.

Execution Sample

Typescript

let count = 0;

function increment() {
  count++;
  console.log(count);
}

increment();
increment();

This code declares a global variable 'count', then a function increments and prints it twice.

Execution Table

Step	Action	Variable 'count' Value	Output
1	Declare global variable count = 0	0
2	Call increment()	0
3	Inside increment(): count++	1
4	Inside increment(): console.log(count)	1	1
5	Call increment() again	1
6	Inside increment(): count++	2
7	Inside increment(): console.log(count)	2	2

💡 Program ends after two calls to increment(), count is 2.

Variable Tracker

Variable	Start	After 1	After 2	Final
count	0	1	2	2

Key Moments - 2 Insights

Why does the variable 'count' keep its value between function calls?

Because 'count' is declared globally (see execution_table steps 1 and 3), it is shared and updated across all calls to increment().

What happens if we declare 'count' inside the function instead?

If 'count' is declared inside increment(), it resets each call, so the value won't persist (not shown here, but compare with global declaration in step 1).

Visual Quiz - 3 Questions

Look at the execution table, what is the value of 'count' after the first increment() call?

A 2

B 0

C 1

D undefined

💡 Hint

Check execution_table row 4 where count is incremented and printed.

At which step does the variable 'count' change from 1 to 2?

A Step 6

B Step 3

C Step 2

D Step 7

💡 Hint

Look at execution_table rows 6 and 7 where count is incremented the second time.

If 'count' was declared inside the function, how would the variable_tracker change?

A count would keep increasing globally

B count would reset to 0 after each call

C count would be undefined outside the function

D count would be a constant

💡 Hint

Refer to key_moments explanation about variable scope and persistence.

Concept Snapshot

Declaring global variables in TypeScript:
- Use 'let' or 'var' outside functions
- Global variables are accessible everywhere
- Changes persist across function calls
- Avoid globals for cleaner code
- Example: let count = 0;

Full Transcript

This example shows how to declare a global variable 'count' in TypeScript using 'let'. The variable is initialized to 0 before any function runs. The function 'increment' increases 'count' by 1 and prints it. Each call to 'increment' updates the same global 'count', so the value persists and increases. The execution table traces each step, showing how 'count' changes and when output happens. Key moments clarify why the variable keeps its value between calls and what would happen if it were declared inside the function instead. The visual quiz tests understanding of these steps and variable behavior. The concept snapshot summarizes how to declare and use global variables simply and effectively.