Entrar Ainda não tem acesso?
Solucionado (ver solução)
Solucionado
(ver solução)
4
respostas

Duvida sobre exportar uma função

Referente ao curso JavaScript: programando na linguagem da web, no capítulo Boas Práticas com Javascript e atividade Criando funções

por Ighor Domingos Bandeira
| 63.6k xp | 31 posts

Quando fui tentar recriar os passos do professor na aula, no site, quando eu clicava no botão de "Adicionar" acontecia de todos os elementos serem criados, mas o valor do imc não aparecia na tabela, a célula da tabela referente ao imc era criada mas ficava em branco. Depois de muito olhar o código descobri que aparentemente o motivo era a forma como eu declarava a função. por costume de outros cursos da plataforma eu declarei a função de calcular o imc como : 

const calculaImc = (peso, altura) => {
    let imc = 0
    imc = peso/(altura*altura);
    return imc.toFixed(2);
}

o professor declara como :

function calculaImc(peso, altura){
    let imc = 0
    imc = peso/(altura*altura);
    return imc.toFixed(2);
}

após mudar apenas a declaração, o problema foi resolvido.

Eis minha dúvida. Qual a diferença de ambas as formas de declarar uma função e pq uma funcionou e a outra não?

4 respostas
por Mateus Henrique
| 989.4k xp | 1546 posts
Instrutor Desenvolvedor

Fala Ighor, tudo bem? Espero que sim!

Nesse caso não há nenhuma diferença, aliás eu testei aqui e funcionou corretamente, você verificou se no console não retornou nenhum erro?

por Ighor Domingos Bandeira
| 63.6k xp | 31 posts

não retornava erro nenhum, por isso eu demorei pra conseguir corrigir, já que eu não tinha nenhuma indicação de onde era o problema.

por Ighor Domingos Bandeira
| 63.6k xp | 31 posts

Ainda sobre esse mesmo assunto, quando eu declaro uma função como "const" a posição de "chamada" dessa função no código não pode ser antes da declaração, pois ocorre o erro "Uncaught ReferenceError: Cannot access 'qualquerFuncao' before initialization".

Já declarando como "function" na mesma situação esse erro não acontece.

pq disso?

solução!
por Mateus Henrique
| 989.4k xp | 1546 posts
Instrutor Desenvolvedor

Isso que acontece é chamado de hoisting, onde o JavaScript basicamente lê o código, e declara todas variáveis do tipo var e também funções function, no caso das variáveis elas são apenas declaradas e não tem seus valores atribuidos, por exemplo:

console.log(name) //undefined

var name = "Mateus"

console.log(name) //Mateus

No primeiro console irá retornar undefined porque a variável ja foi declarada porém ainda não foi atribuido nenhum valor a ela, ja no segundo console o valor ja foi atribuido então é mostrado no console Mateus.

No caso das funções criadas com function elas são declaradas e também tem seus valores, ou melhor, lógica atribuidas:

myName() //Mateus

function myName() {
    return "Mateus"
}

myName() //Mateus

Lembrando que esse processo só ocorre com variáveis do tipo var e funções criadas com function diretamente (sem atribui-las a uma variável).

Quando utilizamos variaveis do tipo let ou const esse hoisting não acontece, então devemos usa-las somente após ja declaradas:

console.log(name) //Erro

const name = "Mateus"

console.log(name) //Mateus

Esse erro também ocorre caso declararmos funções anônimas ou arrow functions nesse tipo de variável:

myName() //Erro

const myName = () => {
    return "Mateus"
}

myName() //Mateus

Ou 

myName() //Erro

const myName = function () => {
    return "Mateus"
}

myName() //Mateus

Então acredito que o problema seja onde você chamou a função (acredito que tenha sido antes da declaração dela), ja que ela foi declarada dentro de uma const esse processo de hoinsting não ocorreu sendo assim não funcionando a função