-6

Tenho essa condição logica usando o if/else:

function area(largura, altura) {
    const area = largura * altura
    if (area > 20) {
        console.log(`O valor acima do permitido: ${area}m2.`)
    } else {
        return area
    }
}

console.log(area(5, 5)) //retorna no console "25m2 undefined".

Até onde sabia caso a condição if fosse verdadeira, ele não lia a condição do else. Contudo nessa instrução ele está lendo o else retornando o resultado undefined. Por que isso ocorre?

4
  • 1
    esse undefined deve ser o retorno da função area(5, 5), dentro do seu if ele escreve no console e nao retorna nada por isso da undefined Commented 29/09/2020 às 2:29
  • Entao, mas ele retornou o resultado 25m²...ainda nao entendi pq ele renderizou o else, se a condição do if é verdadeira!
    – user178597
    Commented 29/09/2020 às 2:35
  • fez debug para ter certeza de onde está passando e o que esá mostrado undefined? Commented 29/09/2020 às 9:00
  • Não passou pelo else, o @kervincandido já explicou o problema
    – Largato
    Commented 30/09/2020 às 1:19

3 Respostas 3

3

Ele não entra no else em momento algum, e esse é o problema, no else retorna alguma coisa, quando entra no if ele retornada nada, que é indefinido, e é isso que precisa de verdade.

Acho que é isso que deseja, se não for o problema não está bem definido e todo o código está errado.

function area(largura, altura) {
    const area = largura * altura;
    if (area > 20) {
        console.log(`O valor acima do permitido: ${area}m2.`);
    } else {
        return area;
    }
}

let resultado = area(5, 5);
if (resultado != undefined) console.log(resultado);
console.log(area(5, 5) + 1);
resultado = area(4, 5);
if (resultado != undefined) console.log(resultado);

Coloquei no GitHub para referência futura.

O if é usado para validação do parâmetro, então se ele estiver fora do critério informado ele mostra uma mensagem do log e encerra a função retornando nada, e essa parte é muito importante, como ele não calculou nada o resultado da função é um valor indefinido. Imagino que seja isso que quer, caso não seja, o código está completamente errado e não temos como resolver o problema porque não sabemos o que deve fazer, só podemos ajudar o que está na pergunta.

Então esta é uma função que pode ou não dar um resultado, se o parâmetro está ok ele retorna um resultado válido, se o parâmetro passado não for adequado gera um valor ruim e não retorna um resultado válido, portanto retorna um undefined.

O que fazer para usar a função se ela pode retornar um valor inválido? Deve testar se o valor é válido antes de usá-lo. Esse é um padrão de projeto dos mais conhecidos e usados.

Então guarda o resultado em uma variável e faz um if para ver se o valor é válido, e só se for é que pode usar a variável em algum lugar, como imprimí-la por exemplo.

Mas se não quer que retorne um valor inválido aí teria que tirar a condição e aceitar qualquer valor passado. Claro, tem alternativas, mas não é comum ser usada, especialmente em JavaScript. Poderia lançar uma exceção, que por sorte não está na cultura de JS, e teria que tratar na chamada, só muda o jeito de tratar. Ou teria que retornar um valor válido mesmo sendo inválido, o que fará o código ser inconfiável, não faria sentido.

Note que se fizer uma conta com o resultado indefinido dá um resultado inválido e isso fica óbvio, você terá que fazer algo para lidar com isso.

Mantenha o undefined

Por que a resposta aceita não é boa? Veja abaixo que em um conta ela dá um resultado equivocado silenciosamente, se você não tomar cuidado causa um enorme estrago. A minha solução faz dar um erro claro e óbvio, não dá para continuar com aquele valor.

function area(largura, altura) {
    const area = largura * altura;
    if (area > 20) {
       // Ou retornas false ou null
       console.log(`O valor acima do permitido: ${area}m2.`);
       return false;
    } else {
       return area;
    }
}

console.log(area(5, 5) + 1);

Coloquei no GitHub para referência futura.

0

Isso acontece pois quando você executa uma função com console.log(myFunction()) ele espera algum return da sua função.

O seu if ocorre corretamente, e executa o seu console.log(), mas você executa a função atráves do console.log() ele espera algum return e não retorna nada.

Com isso o JS mostra undefined.

Para resolver isso, você poderia trocar o console.log() por um return, ficaria assim:

function area(largura, altura) {
    const area = largura * altura;
    if (area > 20) {
       return false;
    } else {
       return area;
    }
}

var valor = area(4, 5);

if(!valor)
{
  console.log("Os valores informados são altos demais.");
}else{
  console.log(valor);
}

8
  • 2
    E se isso for usado em uma conta?
    – Maniero
    Commented 29/09/2020 às 11:45
  • Não sei o que isso seria, sou iniciante, você poderia me explicar? Commented 29/09/2020 às 13:42
  • Olhe a minha resposta.
    – Maniero
    Commented 29/09/2020 às 13:45
  • Editei a minha resposta, ficou melhor? Commented 29/09/2020 às 13:54
  • melhorou, mas ainda cai no problema que eu falo na minha resposta.
    – Maniero
    Commented 29/09/2020 às 14:03
-6

Muito simplesmente o código não está a ler a condição else.

O código não está a retornar nenhum resultado dentro da condição if, por isso quando a função acaba de ser executada o valor retornado é undefined, porque não foi definido nenhum valor. Quando é feito o log do valor é isso mesmo que ele vai escrever.

function area(largura, altura) {
    const area = largura * altura
    if (area > 20) {
        console.log(`O valor acima do permitido: ${area}m2.`)
    } else {
       return area
    }
}

// Aqui faz print de undefined porque não é retornado nenhum valor da função
console.log(area(5, 5)) 

MDN web docs

O valor global undefined representa um valor indefinido. Trata-se de um dos tipos primitivos do JavaScript.

Uma função retorna undefined se um valor não for retornado.

Nota

Editei a resposta e removi a proposta de código considerando os comentários deixados e a questão colocada.

Retornar undefined, false, null, 0, etc. é subjectivo à intenção do programador e aplicação do código. Deve ser sempre considerado quem vai usar o código e o que é considerado um comportamento normal ou excepcional.

Inicialmente esta resposta sugeria uma abordagem com return false. Pode encontrar argumentos a favor e contra nos comentários.

12
  • Dois return seguidos? Como o segundo será executado?
    – Maniero
    Commented 29/09/2020 às 11:45
  • Bem visto @Maniero. Estou a alterar a resposta para ter isso em consideração, mas de qualquer forma não se deve deixar passar undefined Commented 29/09/2020 às 11:48
  • 1
    Sim, quando o cálculo tem parâmetros de entrada errados é para falhar. O objetivo é justamente esse. Esse JSFiddle mostra o absurdo que é retornar qualquer coisa diferente de undefined. Ele dá um resultado completamente errado, você não pode somar algo com o que não pode ser calculado, só um erro é aceitável nesse caso. Você está fazendo o inexiste se transformar em 0, mas o inexistente é diferente de 0, zero é um valor válido,inexistente é inválido.Uma resposta errada é uma boa resposta para uma função?È o q a sua responde, você trata o erro como se fosse uma resposta válida e arbitra ser 0
    – Maniero
    Commented 29/09/2020 às 16:49
  • 2
    Como assim undefined não é uma boa resposta para uma função? Então a própria API da linguagem está toda errada, tem muitas funções nativas que retornam undefined para indicar uma condição excepcional ou valor inválido (e quem chamou a função que trate de verificar o retorno para saber se deu certo - o tratamento do erro, no caso, fica fora da função, pois ela só indica o que aconteceu - até porque o tratamento pode variar, então faz mais sentido ficar fora mesmo).
    – hkotsubo
    Commented 29/09/2020 às 17:14
  • 1
    @hkotsubo pt.stackoverflow.com/q/21767/101
    – Maniero
    Commented 29/09/2020 às 17:25