Skip to main content

Command Palette

Search for a command to run...

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

Updated
•3 min read•View as Markdown
Function Declaration vs Function Expression: What’s the Difference?
M
I write blogs to make concept easier for beginners.

Imagine you need to do a certain task again and again. And you writing the same piece of code more than one time just to do the same task. That will a a very in-efficient way to write code. You can use functions, let’s understand it

What Functions are

Functions includes a block of code, which will run once we call them. It is reusable. So we can call the function as many times as we want. Now we won’t have to write the same code again and again.

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

add(2,3) // 5
add(3,4) // 7

Why we need Functions

Functions are extremely important in programming because they help organize and reuse code.

  • Code Reusability - You can write code once and use it many times.

  • Cleaner and Organized Code - The code becomes shorter and easier to read.

  • Programs Easier to Maintain - If you need to change logic, you only update it in one place.

  • Helps Break Big Problems into Small Parts - Large applications are built using many small functions.

Function Declaration Syntax

 A function declaration is the most common way to create a function in JavaScript. Here the function is created using ‘function’ keyword and we can accept parameters.

 Can be called before it is defined because of hoisting .

sayHello(); // Hello

function sayHello() {
  console.log("Hello");
}
// This works because function declarations are hoisted.

Function Expression Syntax

 A function expression is when the function is stored inside a variable. These are nameless function. And function keyword is optional, you can also use arrow function over there.

 
// Syntax

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

// Example

const greet = function(name) {
  console.log("Hello " + name);
};

greet("Mehtab"); // Hello Mehtab

Example (this will cause an error):

greet("Mehtab"); // error -> Because the variable is not initialized yet

const greet = function(name) {
  console.log("Hello " + name);
};

Quick Comparison

Feature

Function Declaration

Function Expression

Syntax

function greet(){}

const greet = function(){}

Hoisting

Yes

No

Function name

Required

Optional

Stored in variable

No

Yes

When to use each type

When to Use Function Declaration

Use function declarations when the function is a main part of your program and should be available everywhere in the file.

Good for:

  • Utility functions

  • Functions used multiple times

  • Functions you want to call before they appear in the code

When to use Function Expression

Use function expressions when you want to store a function inside a variable or pass it around like data.

Good for:

  • Callback functions

  • Functions inside other functions

  • Functions used once

  • More controlled execution

Conclusion

This concludes our blog, where we understood function structure and two types function declaration and function expression. And when to use each type.