Home > Software design >  React js - Difference between "const example = () => {}" and "function example ()
React js - Difference between "const example = () => {}" and "function example ()

Time:09-21

I have built this code:


const example = () => {

  console.log("test");

}
function example() {
 
  console.log("test");

}

Seeing as their output and use are identical, is there any significant difference between the two?

CodePudding user response:

The only thing i could find is about Hoisting, if you use some component before declaring it, you should use function so your linter wouldn't throw an error.

Like this

 const App = () => (
    <>
      <MyComponent />
      <AlsoMyComponent />
    </>
)
// I like to keep my components at the bottom

function MyComponent() {}

function AlsoMyComponent() {}

Check this out: https://dev.to/ugglr/react-functional-components-const-vs-function-2kj9

CodePudding user response:

Function Expression:

const example = () => {
  console.log("test");
}

Function Declaration

function example() {
  console.log("test");
}
  • Function declarations load before any code is executed while Function expressions load only when the interpreter reaches that line of code.
  • Similar to the var statement, function declarations get hoisted to the top of other code. Function expressions doesn't get hoisted, which allows them to retain a copy of the local variables from the scope where they were defined.
  • Related