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

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.

```javascript
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 .**

```javascript
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.

```javascript
 
// 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):

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

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

**Quick Comparison**

<table style="min-width: 315px;"><colgroup><col style="min-width: 25px;"><col style="min-width: 25px;"><col style="width: 265px;"></colgroup><tbody><tr><td colspan="1" rowspan="1"><p><strong>Feature</strong></p></td><td colspan="1" rowspan="1"><p><strong>Function Declaration</strong></p></td><td colspan="1" rowspan="1" colwidth="265"><p><strong>Function Expression</strong></p></td></tr><tr><td colspan="1" rowspan="1"><p>Syntax</p></td><td colspan="1" rowspan="1"><p>function greet(){}</p></td><td colspan="1" rowspan="1" colwidth="265"><p>const greet = function(){}</p></td></tr><tr><td colspan="1" rowspan="1"><p>Hoisting</p></td><td colspan="1" rowspan="1"><p>Yes</p></td><td colspan="1" rowspan="1" colwidth="265"><p>No</p></td></tr><tr><td colspan="1" rowspan="1"><p>Function name</p></td><td colspan="1" rowspan="1"><p>Required</p></td><td colspan="1" rowspan="1" colwidth="265"><p>Optional</p></td></tr><tr><td colspan="1" rowspan="1"><p>Stored in variable</p></td><td colspan="1" rowspan="1"><p>No</p></td><td colspan="1" rowspan="1" colwidth="265"><p>Yes</p></td></tr></tbody></table>

![](https://cdn.hashnode.com/uploads/covers/69078637d192b5f0327809a3/9ecc534a-30e5-45c0-a2bb-0d4a3ce833f3.png align="center")

> ## 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.

* * *
