Closures vs Classes for Data Privacy in JavaScript

Closures vs Classes for Data Privacy in JavaScript

JavaScript offers two main approaches for data privacy: closures (functional) and #private class fields (class-based). Here is how they compare.

Closures (Functional Approach)

function createCounter() {
  let count = 0;
  return {
    increment: () => ++count,
    getCount: () => count,
  };
}
const c = createCounter();
c.increment();
c.getCount(); // 1
``
Private state is in the function's lexical environment. Methods are arrows (no `this` issues). Each instance gets its own methods.

### `#private` Class Fields (Class Approach, ES2022)

```js
class Counter {
  #count = 0;
  increment() { return ++this.#count; }
  getCount() { return this.#count; }
}
const c = new Counter();
c.increment();
c.getCount(); // 1
c.#count; // SyntaxError (truly private)
``
Private state is on the instance. Methods are on the prototype (shared). `#count` is not accessible outside the class.

### Comparison

| Feature | Closures | `#private` Fields |
|---|---|---|
| Privacy | Yes (lexical env) | Yes (`#` syntax) |
| Methods | Per-instance | Shared (prototype) |
| `this` | Not needed (arrows) | Required |
| Inheritance | Not built-in | Yes (`extends`) |
| Memory | Higher (per-instance methods) | Lower (shared methods) |
| Syntax | Functional | Class-based |
| Inspection | Cannot inspect private vars | Cannot inspect `#` fields |
| Browser support | Universal | Modern browsers (ES2022) |

### When to Use Closures

- **Functional style**: you prefer functions over classes.
- **No `this` issues**: arrow methods avoid `this` binding problems.
- **Simple factories**: creating a few instances with private state.
- **Older environments**: closures work everywhere, `#private` needs ES2022.

### When to Use `#private` Fields

- **Class-based code**: you are already using classes.
- **Inheritance**: you need `extends` and `super`.
- **Many instances**: shared prototype methods save memory.
- **Modern environment**: you can rely on ES2022 support.

### Hybrid Approach

You can use closures inside a class:

```js
class Counter {
  #count = 0;
  increment = () => ++this.#count; // arrow, per-instance, closes over this
  getCount = () => this.#count;
}
``
This gives you arrow methods (no `this` binding issues) but at the cost of per-instance methods. Use sparingly.

### The Takeaway

Closures provide functional-style privacy with per-instance methods and no `this` issues. `#private` class fields provide class-based privacy with shared prototype methods and inheritance. Use closures for functional factories, `#private` for class-based code with many instances.