What does `return` do?

Can someone please tell me what this {…return sandwich} in function mean?

11 Likes

return sends whatever follows back to the line of code that invoked the function which programmers refer to as the ‘caller’. In this case the value stored in the variable sandwich is returned. This is a very rudimentary example of a function to show the basic structure in a generic programming language.
Consider this:

function makeSandwich(topping1, topping2) {
  return 'bread, ' + topping1 + ', ' + topping2 + ', ' + 'bread';
}

console.log(makeSandwich('ham', 'cheese')); //This line of code is the caller when executed
console.log(makeSandwich('peanut butter', 'jelly')); //Same for this line
console.log(makeSandwich('turkey', 'provolone')); //Also this line

Output:

bread, ham, cheese, bread
bread, peanut butter, jelly, bread
bread, turkey, provolone, bread

The code above is JavaScript, and you can see that by using a function we can repeat actions as often as we like by invoking the function. The console.log() method is JavaScript’s way of printing output to the console, so we can see it. Don’t get too hung up on understanding everything just yet. This will all make a lot more sense as you progress on your learning to code journey. Happy Coding!

71 Likes

Thank you for your reply

1 Like

I’m on .5 Putting It All Together. I am told to change ‘burger patty’ and ‘pickles’ to ‘peanut butter’ and ‘jelly’. I set burger patty = peanut butter, and pickles = jelly, but when I run the code I get "Error in code! Expected variable ‘result’ to be defined! I tried everything I know, but I’m stuck. Please help so I can progress.

1 Like

Hello, @script8879255297.

Welcome to the forum.

In the last line of code, all you need to do is change “burger patty” to “peanut butter” and “pickles” to “jelly”.
Like so:

result = makeSandwich('peanut butter', 'jelly')
4 Likes

Think of the print statement as causing a side-effect , it makes your function write some text out to the user, but it can’t be used by another function.

I’ll attempt to explain this better with some examples, and a couple definitions from Wikipedia.

Here is the definition of a function from Wikipedia

A function, in mathematics, associates one quantity, the argument of the function, also known as the input, with another quantity, the value of the function, also known as the output…

Think about that for a second. What does it mean when you say the function has a value?

What it means is that you can actually substitute the value of a function with a normal value! (Assuming the two values are the same type of value)

Why would you want that you ask?

What about other functions that may accept the same type of value as an input ?

1 Like

So ‘bread’ is put in parenthesize in order to define it as a variable? better question, why don’t the contents of the sandwich have parenthesize around them?

Welcome, and nicely expressed (pun intended).

On the premise that all assignments are references to values, and all objects are values, and all expressions are values, it follows that any expression can be represented in the form of a function.

a < b

y = a * x ** 2 + b * x + c    // y = f(x)

(a + b) ** 2 === a ** 2 + 2 * a * b + b ** 2

In the last example we are equating two expressions. It, like the first expression both yield a boolean.

Bottom line, anything that can be deemed a value can also be deemed an expression.

const foo = (a, b) => a ** 2 + 2 * a * b + b ** 2;

const bar = (a, b) => (a + b) ** 2;

console.log(foo(10, 7) === bar(10, 7));

Blocks themselves are expressions, even when they contain code statements…

 > {
     const foo = (a, b) => a ** 2 + 2 * a * b + b ** 2;
     const bar = (a, b) => (a + b) ** 2;
     console.log(foo(10, 7) === bar(10, 7));
   }
   true
<- undefined

All that adding function syntax does is make that block re-usable by giving it a reference, able to take arguments, and able to inherit from Function.prototype.

 > typeof(() => {})
<- "function"
 > (() => {}).constructor()
<- ƒ anonymous(
   ) {

   }

There are some limitations in arrow function expressions that are not imposed on literal function expressions, but beyond those concerns, they are basically the same thing. Good old expressions.

It may take some time to absorb this concept, but far and away it is the most vital one to catapult to the top of one’s understanding, going forward. Think in terms of expressions and the logic begins to flow from there. You’ll see.

Because ES functions are First Class Citizens they can return other functions. That means we can specify the coefficients in one call, and have it return a function that takes any variable against those coefficients.

const quadraticX = function (a, b, c) {
  return function (x) {
    return a * x ** 2 + b * x + c;
  }
}
 > xSquared = quadraticX(1, 0, 0)
   ƒ (x) {
       return a * x ** 2 + b * x + c;
     }
 > console.log(xSquared(33))
   1089
<- undefined
 > 
1 Like

dammm thanks bro

Thanks = ‘Thank you so much’
Print (Thanks)
Thank you so much

1 Like

so return keyword is like a variable that stores a value without = operator but only when shows up in console when we print the object with parameters directly or can be print with storing the object with parameters in variable and then printing it.

Hello, @player1018086214088, and welcome to the forums.

Not sure I’m following you exactly, but return is not like a variable. It doesn’t store anything. It simply sends a value back to the line of code that called the function. That is all it does. We can assign a variable to the returned value. We can also print the value with or without assigning a variable. Perhaps the following examples written in JavaScript may help.

function simpleFunction(someParameter) {
  return "You sent " + someParameter + " as an argument to this function.";
};

//Simply print the return value:
console.log(simpleFunction("tomato"));
// Expected output: You sent tomato as an argument to this function.

// Assign a variable to the return value:
let myVariable = simpleFunction("cheese");
// myVariable is now assigned to the string value, "You sent cheese as an argument to this function."
// We can see the value by printing the variable:
console.log(myVariable);
// Expected output: You sent cheese as an argument to this function."

If we run the above code, the output would be:
Output:

You sent tomato as an argument to this function.
You sent cheese as an argument to this function.

5 Likes

Thanks for a very good explanation. It helped me a lot.

1 Like

Hi! I’m confused. How come we are not seeing that statement of
console.log (makeSandwich(‘ham’, ‘cheese’)); in this lesson?

At the end of the code, we only see the return sandwich statement and then the hamburger object on the left falls with the arguments we give!

In order to print to the user (screen) shouldn’t there be a print statement??

The lesson is just showing how functions are used to create re-usable blocks of code. There’s a lot more to creating the graphic than a console.log() statement. There is a lot of code behind the scenes being executed to create the sandwich graphic, but the function that you wrote/edited is being called to determine what the sandwich consists of.

1 Like

I thought so but was not so sure. I guess these first lessons are just there to kind of “show” a very high-level overview??? I get very hung-up on details sometimes. Not good haha.

The syntax and other details will come with the proper skill paths/career paths or languages we choose to learn.

Thanks for replying to me! @midlindner

1 Like

Great piece of advice to see as I encounter my first confusion!

1 Like