📋 Functions

The Recipe Card Analogy

When you want to make pancakes, you don't memorize every step. You follow a recipe:

• Mix flour, eggs, milk
• Heat pan
• Pour batter
• Flip when bubbly
• Serve

A function is a recipe for your code.

You write the steps once, give the recipe a name ("makePancakes"), and use that name whenever you want pancakes. Want many batches? Just call the recipe many times.

Why Functions Exist

The Problem: Repeated Code

Without functions, if you need to do the same thing many times, you write it many times:

// Calculate tax for a few items
taxForFirstItem = priceForFirstItem * taxRate
taxForSecondItem = priceForSecondItem * taxRate
taxForThirdItem = priceForThirdItem * taxRate

// What if tax rate changes? Update ALL of them!

With functions:

function calculateTax(price):
    return price * taxRate

taxForFirstItem = calculateTax(priceForFirstItem)
taxForSecondItem = calculateTax(priceForSecondItem)
taxForThirdItem = calculateTax(priceForThirdItem)

// Rate changes? Update ONE place!

Functions give you:

• Reusability: Write once, use everywhere
• Maintainability: Change in one place
• Readability: calculateTax() is clearer than price * taxRate

The Four Parts of a Function

How Functions Work

Define the function (write the recipe)

function greet(name) {
  return "Hello, " + name + "!";
}

Call the function (use the recipe)

greet("Alice"); // Returns "Hello, Alice!"
greet("Bob"); // Returns "Hello, Bob!"

You define it ONCE. You call it as many times as you want.

Parameters vs Arguments

Parameters = The placeholders in the recipe (ingredients needed) Arguments = The actual values you pass in (ingredients you use)

function add(a, b):        ← a, b are PARAMETERS
    return a + b

add(x, y)                  ← x, y are ARGUMENTS

Think of it like:

• Parameter = "some eggs" (the recipe says)
• Argument = The actual eggs you crack into the bowl

Return Values

Functions can give back results:

function makeFullName(firstName, lastName):
    return firstName + " " + lastName

fullName = makeFullName("Alice", "Lee")

Without return: The function does something but gives nothing back.

function sayHello(name):
    print("Hello, " + name)
    // No return - just prints

sayHello("Alice")     // Prints "Hello, Alice"
                      // Returns nothing (undefined)

Real-World Examples

Validation

function isValidEmail(email):
    return email contains "@" and email contains "."

isValidEmail("alice@example.com")  → true
isValidEmail("invalid")             → false

Formatting

function formatPrice(amount):
    return "$" + formatAsCurrency(amount)

Calculations

function calculateDiscount(price, discountPercent):
    return price - (price * discountPercent)

API Calls

function fetchUser(userId):
    return fetch('/api/users/' + userId)

Functions With Default Values

Sometimes you want optional parameters:

function greet(name, greeting = "Hello"):
    return greeting + ", " + name + "!"

greet("Alice")             → "Hello, Alice!"
greet("Bob", "Welcome")    → "Welcome, Bob!"

If you don't provide greeting, it defaults to "Hello".

Common Mistakes

Mistake: Forgetting to Return

// ❌ Calculates but doesn't return!
function add(a, b):
    a + b              // Result calculated but lost!

result = add(x, y)     // result is undefined!

// ✓ Correct
function add(a, b):
    return a + b       // Result returned

result = add(x, y)     // result is the sum

Mistake: Too Many Parameters

// ❌ Hard to remember order
function createUser(name, email, age, city, country, role):
    ...

createUser("Alice", "a@test.com", ageValue, "Sydney", "AU", "admin")
// Which one is age? City? Role?

// ✓ Use an object
function createUser(userData):
    ...

createUser({
  name: "Alice",
  email: "a@test.com",
    age: ageValue,
  city: "Sydney"
})

Mistake: Functions That Do Too Much

// ❌ Does too many things
function processOrder(order):
    validate order
    calculate tax
    apply discount
    charge payment
    send email
    update inventory
    generate invoice

// ✓ Split into smaller functions
validateOrder(order)
calculateTotal(order)
processPayment(order)
sendConfirmation(order)

Rule of thumb: A function should usually do one thing well.

Pure vs Impure Functions

Pure functions:

• Given the same inputs, they return the same outputs
• Don't change anything outside themselves

function add(a, b):
    return a + b      // Same inputs → same output

Impure functions:

• May give different outputs for same inputs
• Change things outside themselves (side effects)

counter = initialCount
function increment():
    counter = counter + incrementStep   // Changes external variable!
    return counter

Pure functions are easier to test and debug.

FAQ

Q: When should I create a function?

When you're doing the same thing more than once, or when a block of code has a clear purpose that deserves a name.

Q: How long should a function be?

Often just long enough to understand at a glance. If you can't describe what it does in one sentence, it probably does too much.

Q: What's the difference between function declaration and expression?

Declaration: function add(a, b) { ... } Expression: const add = function(a, b) { ... }

Declaration is "hoisted" (can be called before it's defined). Expression is not.

Q: What are arrow functions?

Shorter syntax: const add = (a, b) => a + b

Same thing, just more concise.

Q: Can a function return multiple values?

Not directly. Return an object or array:

function getStats(numbers) {
  return { min: ..., max: ..., average: ... };
}

Q: What is a callback function?

A function passed to another function to be called later.

Summary

Functions are reusable blocks of code with a name. They take inputs (parameters), do something, and optionally return an output.

Key Takeaways:

• Functions = reusable recipes
• Parameters = inputs, Return = output
• Define once, call many times
• Keep functions focused on ONE thing
• Use meaningful names that describe what they do
• Prefer pure functions when possible
• Too many parameters? Use an object

Functions are fundamental. Master them and your code becomes organized, reusable, and maintainable!