## DEV Community is a community of 846,223 amazing developers

We're a place where coders share, stay up-to-date and grow their careers. # Return the Sum of Two Numbers

## Task: Return the Sum of Two Numbers

Instructions: Create a function that takes two numbers as arguments and `return` their sum.

Solution:

Let's take a look at this task, understand its components, and improve upon it...

## What are functions?

Functions are one of the fundamental building blocks in JavaScript. A function is composed of a sequence of statements called the function body, but for a function to qualify as one, it should take an input (as function parameters) and return an output where there is a relationship between the two.

### Anatomy of a function

A Function definition (also known as function declaration or function statement) consists of the `function` keyword, followed by:

• The name of the function (`addition`);
• One or a list of parameters to the function, enclosed in parentheses and (in case there is more than one) separated by commas (`a, b`); and
• The JavaScript statements that defines the function, enclosed in curly braces, `{...}`.

While the function definition above is syntactically a statement, functions can also be created by a function expression. Such a function can be anonymous (given that it doesn't have to be named). Refactoring our `addition` function we would have the following:

Using function expressions is convenient when passing a function as an argument to another function.

### Arrow functions

Arrow function expressions have a shorter syntax (with limited functionality) compared to function expressions and are always anonymous.

There are two factors influencing the introduction of arrow functions: (1) shorter functions and (2) non-binding of `this` (for a later post).

In this case we can even opt for dropping the curly braces `{...}` and the `return` statement as they are implied. Refactoring our `addition` function, compare our previous with the following:

However, the curly braces `{...}`, the `return` statement, and even the parentheses `()` may be required in some cases. For example, if you have multiple arguments or no arguments, you'll need to re-introduce parentheses around the arguments. Similarly, if the body requires additional lines of processing, you'll need to re-introduce both the curly braces `{...}` and the keyword `return.`

### What does the `return` statement do for my function?

The `return` statement ends function execution and specifies a value to be returned to the function caller. Its syntax `return [expression];` includes an expression whose value is to be returned. If omitted, `undefined` is returned instead.

As opposed to several other JavaScript statements, the `return` statement is affected by automatic semicolon insertion (ASI). No line terminator (semicolon) between the `return` keyword and the expression would break the statement.

## Data validation: `typeof`

What would happen if we would use any other type of parameter in our `addition` function? In order to make sure the function serves its purpose correctly, we can make use of the JavaScript `typeof` operator.

The `typeof` operator returns a string indicating the type of the unevaluated operand. For our `addition` function we want to make sure the user passes a primitive value parameter with a number type. Therefore, we would include the following JavaScript statement:

Notice that we purposefully used a tradicional `if...else` statement. The **if statement** executes a statement if a specified condition is truthy. If the condition is falsy, another statement can be executed (optional). A very popular and learner alternative leads us to Conditional (ternary) operators.

### Conditional (ternary) operator

The conditional (ternary) operator is the only JavaScript operator that takes three operands: a condition followed by the question mark (`?`), then an expression to execute if the condition is truthy, followed by a colon (`:`), and finally the expression if the condition is falsy. This operator is frequently used as a shortcut for the `if` statement. Finally, refactoring our `typeof` data validation and utilising the conditional (ternary) operator our function would look as follows: