Functions in JavaScript

Analogy categoryAnalogies

1. Introduction

A function is a reusable block of code designed to perform a specific task. Instead of repeating the same logic throughout a program, you define it once inside a function and call it whenever you need it. Functions accept input through parameters, run a series of statements, and can optionally send a value back to the caller using the return keyword. They are one of the most fundamental building blocks in JavaScript, used to organize code, avoid duplication, and create clear, testable units of logic.

🏏

Cricket analogy: A signature bowling action, like Bumrah's slingy yorker delivery, is a reusable routine he repeats every over instead of reinventing each time; parameters are like adjusting line and length per batter, and the return value is the outcome -- wicket or runs conceded.

2. Syntax

javascript

function functionName(param1, param2) {
  // function body
  let result = param1 + param2;
  return result;
}

// calling the function
functionName(argument1, argument2);

3. Explanation

A function declaration starts with the function keyword, followed by a name, a parenthesized list of parameters, and a body enclosed in curly braces. Parameters act as local variables that receive the arguments passed in when the function is called. The return statement ends execution of the function and specifies the value to send back to the caller; if there is no return statement, the function implicitly returns undefined.

🏏

Cricket analogy: A named bowling routine like 'bowlYorker' takes a batter's stance as a parameter, acting like a local scouting note only relevant to that delivery; the return statement is the ball's outcome announced to the scoreboard, and if no outcome is declared, it defaults to 'dot ball' (undefined).

Functions can be called before they appear in the source code, invoked multiple times with different arguments, and nested inside other functions. This makes them essential for breaking large programs into smaller, manageable pieces.

🏏

Cricket analogy: A bowler's yorker routine can be called in over 3 and again in over 18 with different field settings each time (different arguments), and it can even be nested inside a broader 'death overs strategy' routine -- breaking the captain's game plan into manageable pieces.

Gotcha: Function declarations are fully hoisted — both the name and the function body are moved to the top of their scope during compilation, so you can call a function declaration before its definition appears in the code. This does NOT apply to function expressions or arrow functions assigned to a variable; only the variable declaration is hoisted (as undefined with var, or left in the 'temporal dead zone' with let/const), so calling it early throws a TypeError or ReferenceError.

4. Example

javascript

console.log(greet("Ava")); // works even though greet is defined below

function greet(name) {
  return `Hello, ${name}!`;
}

console.log(add(2, 3));

function add(a, b) {
  return a + b;
}

5. Output

text

Hello, Ava!
5

6. Key Takeaways

A function is a reusable block of code that accepts parameters and can return a value.
Function declarations are fully hoisted, so they can be called before they appear in the code.
If no return statement is used, a function returns undefined by default.
Parameters are local to the function and only exist during its execution.
Functions can be called any number of times with different arguments.