Functions: Reusing Logic

Functions: Reusing Logic

A function is a named block of code that does a job. You write the code once, give it a name, and then run it whenever you need it — as many times as you want. Functions are how programmers avoid copying and pasting the same lines over and over.

Defining and Calling a Function

To create a function, you write the word function, a name, parentheses, and a block of code in curly braces. To run it (or "call it"), you write its name followed by parentheses.

function greet() {
  console.log('Hello!');
}

greet(); // prints: Hello!
greet(); // prints: Hello! again

Calling greet() runs the code inside it. Calling it twice runs it twice — one definition, many uses.

Taking Input with Parameters

Functions become much more useful when they can receive input. A parameter is a variable the function uses to hold a value passed in. The value you pass when calling is called an argument.

function greet(name) {
  console.log(`Hello, ${name}!`);
}

greet('Ada');   // prints: Hello, Ada!
greet('Grace'); // prints: Hello, Grace!

A function can take several parameters, separated by commas, and it can return a value — a result the caller can use — with the return keyword. When a function returns, it stops immediately.

function double(n) {
  return n * 2;
}

console.log(double(4));  // prints: 8
console.log(double(21)); // prints: 42

Here, double(4) becomes the value 8 at the place it was called. You can store that result in a variable, do math with it, or pass it to another function.

caption: A function call passing in 4 and receiving back 8. alt: Flow from calling double with 4, the function running, returning 8, and the value 8 arriving where the call happened.

Arrow Functions: A Shorter Form

JavaScript also offers a shorter way to write functions, called an arrow function. It stores a function in a variable instead of using the function keyword.

const double = (n) => {
  return n * 2;
};

// If the body is one return, you can make it even shorter:
const triple = (n) => n * 3;

console.log(double(5), triple(5)); // prints: 10 15

Both forms do the same job here. Arrow functions are everywhere in modern JavaScript, so it helps to read them.

Why Functions Matter

Functions let you:

• Reuse logic instead of repeating it
• Name an idea, making code easier to read
• Test and fix a job in one place

callout tip When a function's job is small and clear — one thing it does well — it stays easy to understand. If you struggle to name a function, that's often a sign it does too much.

callout warning A common mistake is defining a function but forgetting to call it. Writing double(4) calls it; writing just double refers to the function itself without running anything. Similarly, forgetting return means the function gives back undefined, JavaScript's "no value" value.