Day 5: Functions Part 1

Lesson 5: Multiple Inputs

Let's take our last example and make it more useful, make the editor side of the playground wider so you can see this all clearly:

<h1>Hello World<h1>

function convertMeasurement(measurement, unit) {
  if (unit === 'cm') {
    return measurement / 2.54;
  } else {
    return measurement * 2.54;
  }
}

const measurement = 22;

const inches = convertMeasurement(measurement, 'cm');

console.log(inches);

const measurementIn = 12;

const cm = convertMeasurement(measurementIn, 'inches');

console.log(cm);

JavaScript function arguments are positional. That means that the position of what we pass in matters. In this case we must pass in the measurement we want to convert first and then the unit of that measurement second.

If we swap them around it will break the code and not work. Also, we have declared the function as taking two arguments, so we must give it two arguments.

There is an improvement we can make here that demonstrates another important part about functions in JavaScript.

A function will only return once. So in the above if unit === 'cm' is true, then the function will return and no more code will execute. This means we don't need the else statement here, and we can do this instead:

1function convertMeasurement(measurement, unit) {
2  if (unit === "cm") {
3    return measurement / 2.54;
4  }
5  return measurement * 2.54;
6}

Change the convertMeasurement function code to match this and see how it still works the same.

A function can have multiple return statements BUT the first one that it hits and runs will end that function's execution and return

1function convertMeasurement(measurement, unit) {
2  if (unit === "cm") {
3    return measurement / 2.54;
4  }
5  return measurement * 2.54;
6}
7
8convertMeasurement(400, "cm");

So we can input multiple values, what about returning them?