Airbnb's ES6 style guide recommendation about functions

Question

Referring to section 7.1 in the style guide:

// bad
function foo() {
}

// good
const foo = function bar() {
};

I can't seem to understand what exactly is wrong with the first statement ? How is it bad ? (fyi .. I do understand the difference that the first declaration is hoisted and the 'const' do not get hoisted. What I do not understand is being hoisted bad ?

Answer 1

AirBnB has already explained why they consider function declarations hosting a bad thing here :

7.1 Use named function expressions instead of function declarations.

Why? Function declarations are hoisted, which means that it's easy - too easy - to reference the function before it is defined in the file. This harms readability and maintainability. If you find that a function's definition is large or complex enough that it is interfering with understanding the rest of the file, then perhaps it's time to extract it to its own module! Don't forget to name the expression - anonymous functions can make it harder to locate the problem in an Error's call stack.