What is the difference between a function declaration and a function expression?

Question

Accepted Answer

A **declaration** is a named function statement; an **expression** assigns a function to a variable. The practical difference 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"; };
```

## Why the difference

Function declarations are hoisted **with their body**, so the whole function exists before execution reaches it. A function expression is just a value assigned to a variable — at the point of the early call, `expressed` is still `undefined` (with `var`) or in the TDZ (with `let`/`const`).

## When to use which

```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 read well for top-level named functions and benefit from hoisting (you can define them after their use). Expressions are necessary for arrow functions, callbacks, IIFEs, and assigning functions conditionally. Arrow functions are always expressions.