Existem duas formas de se criar funções no Javascript: com function declaration e function expression. Vamos entender a diferença entre as duas.
Functions Return
Por padrão todas as funções no Javascript retornam
undefined. Para retornar outros valores precisamos declarar um return.Function Declaration
Dessa maneira, utilizamos a palavra chave
function seguida de um nome para a função.function add(a,b) {}
Essas funções sofrem hoisting e ficam disponíveis no topo do bloco ou escopo global. Logo, podemos usá-las antes de serem declaradas.
const sum = add(1,2) function add(a,b) { return a + b }
Function Expression
Podemos usar a palavra chave
function para criar uma função dentro de uma expressão - ver Statement vs Expression . A principal diferença entre uma function declaration e function expression é o fato de que o nome da função pode ser omitido na function expression para criar uma função anônima (anonymous function expression).Uma function expression pode ser usada como uma IIFE (immediately invoked function expression)
Outra diferença é que uma function expression não sofre hoisting, logo não podemos usá-las antes de serem declaradas
const result = sum(1,2) console.log(sum) // Output: undefined var sum = function() { return a + b } // Output: sum is not a function
Mesmo que a declaração da variável
sum tenha sofrido hoisting, sua definição não, ou seja, a variável não foi iniciada. Logo, é undefined.Named Function Expression
Se quisermos utilizar a função atual dentro do seu escopo, precisamos atribuir um nome para essa função, e então criamos uma named function expression. Esse nome está disponível apenas localmente no escopo da função.
const random = { fn: function randomizer(arg) { console.log(arg) if (!arg) return 0 return fn(0) } }
Nesse caso atribuímos explicitamente o nome
randomizer para a função, então o nome da variável fn não será usado na call stack. Por outro lado, se o nome for omitido, então o nome da variável será utilizado implicitamente.