Why, in addition to printing the expected result, console.log also prints Undefined?

Asked

Viewed 57 times

0

I am following an example of a course and I was left with the doubt of why, in this code:

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

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

After executed the result will also give undefined?

Valor acima do permitido: 25m2.
undefined

I know you have other better ways of doing this code, but I want to understand why undefined.

  • 1

    If the condition if(area > 20) for true, what will be the return of the function area?

2 answers

2

This happens because the browser Console (or some REPL - like the one in Node.js) displays the evaluation result of the code that will be evaluated in it.

We assume you insert the expression 4 + 4 on the Console. The Runtime evaluate the expression and return its result. In this example, it will be 8.

In the case of functions, the Console will print the result of the function evaluation which is ultimately the function’s own return value.

More specifically, in relation to console.log, is a function that returns the value undefined. Thus, although the console.log also print the messages in the Console, finally, will be printed the function return value itself, which in the case of console.log, is undefined.


You can check the return value of console.log:

const result = console.log('Foo!'); // Irá imprimir "Foo!", mas o valor retornado é `undefined`.

console.log('Resultado:', result); //=> Resultado: undefined
console.log('Igual a undefined?', result === undefined); //=> true

0

As commented by other colleagues, its function has a point at which no value returns, and as the function console.log() validates an expression, when the area is greater than 20, will not return anything to the console.log validate.

With this in mind, you could solve this using an auxiliary variable to receive the result from the area, for example return the value of the area when allowed, or "-1" when not allowed, and then treat this return in your program.

function area(largura, altura) {
    const area = largura * altura;
    if(area > 20) {
        console.log(`Valor acima do permitido: ${area}m2.`);
        // Primeira possibilidade de retorno da sua função
        return -1;
    } else {
        // Segunda possibilidade de retorno da sua função
        return area;
    }
};

const resultado = area(5, 2);

// Caso o resultado seja -1, a própria função irá exibir que a area é maior que a permitida
if(resultado > 0){
  console.log("Área:", resultado);
}

  • Then the console.log called the area function, the function ran until the end, in the meantime it was running it printed the console.log(Valor acima do permitido: ${area}m2.);, by default returned Undefined to where the function was called, since no value was returned.

  • Exactly that, its function displayed that the value was above the allowed value and did not return anything to the console.log that called it.

Browser other questions tagged

You are not signed in. Login or sign up in order to post.