Suggest an edit

Improve this article

Refine the answer for “Global variables”. Your changes go to moderation before they’re published.

Approval required

Content

What you’re changing

Title (EN)

Short answer (EN)

Shown above the full answer for quick recall.

Answer (EN)

## What a global variable is

**A global variable** is a variable accessible **throughout the entire code of the program**, in **all functions and modules**.

In the browser, it becomes a **property of the** `window` object,
in Node.js: a property of the `global` object.

```javascript
var count = 0; // a global variable
function increment() {
  count++;
}
```

---

## Why you **should not** use global variables

Here are the main reasons:

---

### 1. Name collisions

If a project is large (or the code is combined with libraries),
then **several parts of the program may use the same variable**.

```javascript
var data = "User data";
// somewhere else in the code
var data = "Product data"; // Overwrites the previous value
```

The result: **unexpected behavior** and **bugs that are hard to debug**.

---

### 2. Difficulty of debugging and predictability

Global variables can change **anywhere in the program**,
so it is **hard to tell** exactly where their value was changed.

```javascript
let counter = 0;

function a() { counter++; }
function b() { counter = 10; }
function c() { counter--; }

c(); a(); b();
console.log(counter); // what happens here?
```

The program becomes hard to test and maintain.

---

### 3. Global variables "clutter" the namespace

All global variables are stored in one place (`window`, `global`),
and the more there are, the higher the chance of **unpredictable collisions**.

```javascript
window.alert = 42; // now alert no longer works
```

---

### 4. Bad for testing and modularity

If a function relies on global data, it cannot be tested in isolation.

```javascript
let rate = 0.1;
function calculateTax(amount) {
  return amount * rate; // tied to the global variable
}
```

It is better to pass the dependency explicitly:

```javascript
function calculateTax(amount, rate) {
  return amount * rate;
}
```

---

### 5. Non-obvious behavior in asynchronous code

In asynchronous scenarios (setTimeout, promises, and so on), global variables can change before their value is used.

```javascript
let user = "Alice";

setTimeout(() => {
  console.log(user); // we expect "Alice"
}, 1000);

user = "Bob"; // the global variable changed before the call ran
```

Result: `"Bob"`.

---

## The right way

| Instead of global variables | Use |
|---|---|
| `var` at the root of a file | `let` / `const` inside a function or block |
| Shared data between modules | Export/import (`import/export`) |
| Configuration | Passing it through parameters or context |
| State | Local objects, classes, React state, Redux, and so on |

---

## Exceptions: when it is OK

Global variables are acceptable **in limited, controlled cases**:

- Configuration settings (for example, `APP_VERSION`)
- Useful utilities in a modular environment (`globalThis.MyApp = {}`)
- When it is a **deliberate design decision**, and access to them is strictly controlled

---

## The short way to remember it

| Reason | Why it is bad |
|---|---|
| Name collisions | Two parts of the program can use the same name |
| Hard debugging | Unpredictable changes from different places |
| A cluttered namespace | `window`/`global` gets overloaded |
| Non-isolated tests | Functions depend on external state |
| Bugs in asynchronous code | Global values change unpredictably |

Markdown · drag & drop images · ⌘B / ⌘I shortcuts540 words

For the reviewer

Note to the moderator (optional)

Visible only to the moderator. Helps review go faster.