Wat is het verschil tussen een functiedeclaratie en een functie-expressie?

Question

Accepted Answer

A **declaration** is een benoemde functie-statement; an **expression** kent een functie toe aan een variabele. Het praktische verschil is **hoisting**.

```js
// Declaration — fully hoisted, callable before its line
declared();             // ✅ works
function declared() { return "hi"; }

// Expression — only the variable binding is hoisted, not the function
expressed();            // ❌ TypeError: expressed is not a function
var expressed = function () { return "hi"; };
```

## Waarom het belangrijk is

Functiedeclaraties worden geheven **met hun body**, dus de volledige functie bestaat voordat de uitvoering er naartoe gaat. A function expression is slechts een waarde die aan een variabele is toegekend — op het punt van de vroege aanroep is `expressed` nog steeds `undefined` (met `var`) of in de TDZ (met `let`/`const`).

## Wanneer welke gebruiken

```js
// expression — for callbacks, conditional definitions, arrow functions
const handler = () => doThing();
const fn = condition ? a : b;
arr.map(x => x * 2);

// declaration — clear, hoisted top-level functions
function calculateTotal(items) { ... }
```

Declarations lezen goed voor naamgeving functies op het hoogste niveau en profiteren van hoisting (je kunt ze definiëren na hun gebruik). Expressions zijn nodig voor arrow functions, callbacks, IIFEs en het voorwaardelijk toekennen van functies. Arrow functions zijn altijd expressions.