Function Declaration vs Function Expression: What’s the Difference?

What Are Functions in JavaScript?

In programming, a function is a reusable block of code that performs a specific task.

Instead of writing the same code again and again, we can place it inside a function and call it whenever needed.

Functions help us:

Reuse code
Organize programs
Make code easier to read and maintain

Example

function add(a, b) {
  return a + b;
}

console.log(add(5, 3)); // 8

In this example, the add function takes two numbers and returns their sum.

Function Declaration Syntax

A function declaration is the traditional way of defining a function in JavaScript.

Syntax

function functionName(parameters) {
  // code to execute
}

Example

function multiply(a, b) {
  return a * b;
}

console.log(multiply(4, 5)); // 20

Here:

multiply is the function name
a and b are parameters
The function returns the multiplication of the two numbers

Function declarations are defined using the function keyword and a name.

Function Expression Syntax

A function expression is when a function is stored inside a variable.

Syntax

const variableName = function(parameters) {
  // code
};

Example

const multiply = function(a, b) {
  return a * b;
};

console.log(multiply(4, 5)); // 20

Here:

The function does not need a name
It is assigned to the variable multiply
We call it using the variable name

Function expressions are often used when functions are treated as values.

Key Differences Between Function Declaration and Function Expression

Feature	Function Declaration	Function Expression
Definition style	Uses `function` with a name	Function stored inside a variable
Hoisting	Fully hoisted	Not fully hoisted
Usage before definition	Possible	Not possible
Syntax style	Standalone statement	Part of an expression

Example Comparison

// Function Declaration
function greet() {
  console.log("Hello!");
}

// Function Expression
const greet2 = function() {
  console.log("Hello!");
};

Basic Idea of Hoisting

Hoisting is a JavaScript behavior where function declarations are moved to the top of their scope during execution.

This means you can call a function before it is defined.

Example (Works)

sayHello();

function sayHello() {
  console.log("Hello!");
}

The function works even though it was called before its definition.

Example with Function Expression (Does NOT Work)

sayHi();

const sayHi = function() {
  console.log("Hi!");
};

This will produce an error because function expressions are not hoisted the same way.

When Should You Use Each Type?

Use Function Declaration When

You want a reusable function
The function is part of the main program logic
You want hoisting behavior

Example:

function calculateTotal(price, tax) {
  return price + tax;
}

Use Function Expression When

Assigning functions to variables
Using functions as arguments
Working with callbacks

Example:

const square = function(num) {
  return num * num;
};

Assignment Example