Skip to main content

Stateless function

JavaScriptJunior~2 min read
Suggest an edit

A stateless function is a function that remembers nothing about previous calls and does not depend on external changes, so the same arguments always produce the same result. Every call is a self contained computation, not a step in some hidden sequence.

Theory

TL;DR

  • A stateless function neither stores nor changes internal data between calls.
  • It has no memory of its own: no counters, caches or flags.
  • It does not use global variables and changes nothing outside (DOM, files, network requests).
  • The result is fully determined by the input arguments.
  • The opposite is a stateful function, whose result depends on previous calls.
  • Such functions are easy to test, to cache and to run in parallel.

Quick example

javascript
function sum(a, b) { return a + b; } console.log(sum(2, 3)); // 5 console.log(sum(2, 3)); // 5, always the same

Every call is completely independent, the result depends only on the input data.

What "stateless" means

A stateless function remembers nothing about past calls and does not depend on external changes. In other words, such a function:

  • has no internal memory (no counters, caches, flags);
  • does not use global variables;
  • changes nothing outside: DOM, files, network requests.

Its behaviour fits in one line: the same arguments give the same result.

Stateless versus stateful

A stateful function remembers the previous call, so two identical calls give different answers:

javascript
let counter = 0; function increment() { counter++; return counter; } increment(); // 1 increment(); // 2, the result depends on the previous call

Here the function keeps state in the counter variable, which makes it stateful. To make it stateless, the state is passed in as an argument and a new value is returned:

javascript
function nextCount(current) { return current + 1; } nextCount(0); // 1 nextCount(0); // 1, the same input always gives the same output

Where stateless functions matter

  • In functional programming: they are the basis of pure computation and function composition.
  • In React: so called stateless components simply render the data they receive and hold no state of their own.
  • In testable code: the result is predictable and independent of the environment, so a test needs no elaborate setup.
  • In distributed systems: any instance of a service can handle the request, because nothing is stored between calls.
TraitStateless function
Stores data between callsNo
Changes external stateNo
Depends only on its argumentsYes
Always returns the same result for the same inputYes
ExampleMath.max(a, b)

In one sentence: a stateless function has no memory of previous calls, and its result depends only on the input data, not on context.

Common mistakes

  • Confusing statelessness with having no variables: local variables inside a function are not state, they live for a single call.
  • Keeping a counter or a cache in a closure and still calling the function stateless: a closure preserves state between calls exactly like a global variable.
  • Forgetting about reads of external data: a call to Date.now() or Math.random() inside already makes the result unpredictable.
  • Mutating a passed object: formally the function stores no state, but it changes the caller's data.
  • Assuming stateless is always better: state has to live somewhere, the point is to make it explicit and keep it in one place.

Short Answer

Interview ready
Premium

A concise answer to help you respond confidently on this topic during an interview.

Suggest an edit