JavaScript Functions: Function Definitions · Advanced Patterns · Callbacks · `this` · call · apply · bind · IIFE · Closures · Reference

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

console.log(greet("Tunde"));   // Output: Hello, Tunde!
console.log(greet("Sara"));    // Output: Hello, Sara!

function   greet        (name)          {
│          │             │               │
keyword    name      parameter(s)    body begins

console.log(add(3, 4));   // Output: 7 ✅ — works even though the function is below

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

const multiply = function(a, b) {
  return a * b;
};

console.log(multiply(4, 5));   // Output: 20

console.log(multiply(4, 5));   // ❌ ReferenceError: Cannot access 'multiply' before initialization

const multiply = function(a, b) {
  return a * b;
};

const factorial = function fact(n) {
  if (n <= 1) return 1;
  return n * fact(n - 1);   // 'fact' is accessible here
};

console.log(factorial(5));   // Output: 120
// console.log(fact(5));     // ❌ ReferenceError — 'fact' not visible outside

const square = (n) => {
  return n * n;
};

console.log(square(6));   // Output: 36

// Full syntax:
const square = (n) => { return n * n; };

// Concise syntax (equivalent):
const square = n => n * n;

console.log(square(7));   // Output: 49

const add = (a, b) => a + b;
console.log(add(10, 3));   // Output: 13

function greet(name = "Guest") {
  return "Welcome, " + name + "!";
}

console.log(greet("Amara"));   // Output: Welcome, Amara!
console.log(greet());          // Output: Welcome, Guest!

function show(value = "default") {
  console.log(value);
}

show();              // Output: default   ← argument is missing (undefined)
show(undefined);     // Output: default   ← explicitly undefined
show(null);          // Output: null      ← null is a real value, not undefined
show("hello");       // Output: hello

function sum(...numbers) {
  let total = 0;
  for (const n of numbers) {
    total += n;
  }
  return total;
}

console.log(sum(1, 2));           // Output: 3
console.log(sum(1, 2, 3, 4, 5)); // Output: 15
console.log(sum());               // Output: 0

function introduce(greeting, ...names) {
  names.forEach(name => console.log(greeting + ", " + name + "!"));
}

introduce("Hello", "Alice", "Bob", "Charlie");
// Output:
// Hello, Alice!
// Hello, Bob!
// Hello, Charlie!

function logAll() {
  console.log(arguments.length);   // How many arguments were passed
  for (let i = 0; i < arguments.length; i++) {
    console.log(arguments[i]);
  }
}

logAll("a", "b", "c");
// Output:
// 3
// a
// b
// c

// 1. Assign a function to a variable
const sayHi = function() { return "Hi!"; };

// 2. Pass a function as an argument to another function
function callIt(fn) {
  return fn();
}
console.log(callIt(sayHi));   // Output: Hi!

// 3. Return a function from another function
function makeMultiplier(x) {
  return function(y) {
    return x * y;
  };
}
const triple = makeMultiplier(3);
console.log(triple(5));   // Output: 15
console.log(triple(10));  // Output: 30

// 4. Store functions in arrays and objects
const operations = [
  (a, b) => a + b,
  (a, b) => a - b,
  (a, b) => a * b,
];
console.log(operations[0](10, 4));   // Output: 14
console.log(operations[2](10, 4));   // Output: 40

function noReturn() {
  let x = 5;   // Does something but returns nothing
}

const result = noReturn();
console.log(result);   // Output: undefined

function checkAge(age) {
  if (age < 0) {
    return "Invalid age";   // Exits here — nothing below runs
  }
  if (age < 18) {
    return "Minor";
  }
  return "Adult";
}

console.log(checkAge(-1));   // Output: Invalid age
console.log(checkAge(15));   // Output: Minor
console.log(checkAge(25));   // Output: Adult

function applyTwice(fn, value) {
  return fn(fn(value));   // Call fn on value, then call fn on the result
}

const double = n => n * 2;

console.log(applyTwice(double, 3));   // Output: 12  (3×2=6, 6×2=12)
console.log(applyTwice(double, 5));   // Output: 20  (5×2=10, 10×2=20)

function makeGreeter(greeting) {
  return function(name) {
    return greeting + ", " + name + "!";
  };
}

const sayGoodMorning = makeGreeter("Good morning");
const sayGoodNight   = makeGreeter("Good night");

console.log(sayGoodMorning("Tunde"));   // Output: Good morning, Tunde!
console.log(sayGoodNight("Sara"));      // Output: Good night, Sara!

// Pure function — predictable, no external impact
function add(a, b) {
  return a + b;
}

// Impure function — depends on external variable; changes it
let total = 0;
function addToTotal(n) {
  total += n;   // Side effect: changes a variable outside the function
  return total;
}

console.log(add(2, 3));   // Always: 5
console.log(add(2, 3));   // Always: 5

addToTotal(5);             // total is now 5
addToTotal(5);             // total is now 10 — same call, different result!

function countdown(n) {
  if (n <= 0) {           // Base case: stop here
    console.log("Done!");
    return;
  }
  console.log(n);
  countdown(n - 1);       // Recursive call: same function with a smaller problem
}

countdown(5);
// Output:
// 5
// 4
// 3
// 2
// 1
// Done!

function factorial(n) {
  if (n <= 1) return 1;         // Base case
  return n * factorial(n - 1);  // Recursive case
}

console.log(factorial(5));   // Output: 120  (5×4×3×2×1)

factorial(4)
  → 4 * factorial(3)
         → 3 * factorial(2)
                → 2 * factorial(1)
                       → 1   (base case)
                → 2 * 1 = 2
         → 3 * 2 = 6
  → 4 * 6 = 24

const double    = n => n * 2;
const addTen    = n => n + 10;
const stringify = n => "Result: " + n;

// Manual composition:
const result = stringify(addTen(double(5)));
console.log(result);   // Output: Result: 20   (5→10→20→"Result: 20")

// Reusable compose function:
function compose(...fns) {
  return function(value) {
    return fns.reduceRight((acc, fn) => fn(acc), value);
    // Applies functions right to left: stringify(addTen(double(value)))
  };
}

const transform = compose(stringify, addTen, double);
console.log(transform(5));    // Output: Result: 20
console.log(transform(10));   // Output: Result: 30

function memoize(fn) {
  const cache = {};

  return function(n) {
    if (cache[n] !== undefined) {
      console.log("From cache: " + n);
      return cache[n];              // Return cached result
    }
    const result = fn(n);
    cache[n] = result;              // Store in cache
    return result;
  };
}

function slowSquare(n) {
  // Simulate slow computation
  return n * n;
}

const fastSquare = memoize(slowSquare);

console.log(fastSquare(5));   // Computed: 25
console.log(fastSquare(5));   // From cache: 25 (instant)
console.log(fastSquare(6));   // Computed: 36
console.log(fastSquare(6));   // From cache: 36 (instant)

function processOrder(item, callback) {
  console.log("Processing order for: " + item);
  callback(item);   // Call the function that was passed in
}

function deliver(item) {
  console.log(item + " has been delivered!");
}

processOrder("Pizza", deliver);
// Output:
// Processing order for: Pizza
// Pizza has been delivered!

function greetUser(name, formatter) {
  const formatted = formatter(name);   // Call the callback right now
  console.log("Hello, " + formatted);
}

greetUser("tunde", name => name.toUpperCase());
// Output: Hello, TUNDE

greetUser("sara", name => name[0].toUpperCase() + name.slice(1));
// Output: Hello, Sara

const numbers = [1, 2, 3, 4, 5];

// forEach: calls the callback for each element
numbers.forEach(function(n) {
  console.log(n * 10);
});
// Output: 10, 20, 30, 40, 50

// map: calls the callback for each element, collects results into a new array
const doubled = numbers.map(n => n * 2);
console.log(doubled);   // Output: [2, 4, 6, 8, 10]

// filter: keeps elements for which the callback returns true
const evens = numbers.filter(n => n % 2 === 0);
console.log(evens);   // Output: [2, 4]

console.log("Start");

setTimeout(function() {
  console.log("This runs after 2 seconds");
}, 2000);

console.log("End");

// Output:
// Start
// End
// (2 seconds later) This runs after 2 seconds

let count = 0;
const interval = setInterval(function() {
  count++;
  console.log("Tick " + count);
  if (count === 3) {
    clearInterval(interval);   // Stop after 3 ticks
    console.log("Done");
  }
}, 1000);

// Output (one per second):
// Tick 1
// Tick 2
// Tick 3
// Done

// ❌ Callback hell — hard to read and maintain
getUser(userId, function(user) {
  getOrders(user.id, function(orders) {
    getProductDetails(orders[0].productId, function(product) {
      getReviews(product.id, function(reviews) {
        console.log(reviews);
        // Nested 4 levels deep — and it can get worse
      });
    });
  });
});

function handleReviews(reviews) {
  console.log(reviews);
}
function handleProduct(product) {
  getReviews(product.id, handleReviews);
}
function handleOrders(orders) {
  getProductDetails(orders[0].productId, handleProduct);
}
function handleUser(user) {
  getOrders(user.id, handleOrders);
}

getUser(userId, handleUser);
// Same logic, but flat and readable

function readFile(filename, callback) {
  // Simulate reading a file
  const error = filename === "missing.txt" ? new Error("File not found") : null;
  const data  = error ? null : "File contents here";
  callback(error, data);
}

readFile("hello.txt", function(err, data) {
  if (err) {
    console.log("Error:", err.message);
    return;   // Stop processing
  }
  console.log("Data:", data);
});
// Output: Data: File contents here

readFile("missing.txt", function(err, data) {
  if (err) {
    console.log("Error:", err.message);
    return;
  }
  console.log("Data:", data);
});
// Output: Error: File not found

function showThis() {
  console.log(this);
}

showThis();   // Output: Window {...}  (in a browser)

const person = {
  name: "Tunde",
  greet: function() {
    console.log("Hello, my name is " + this.name);
  }
};

person.greet();   // Output: Hello, my name is Tunde

const person = {
  name: "Tunde",
  greet: function() {
    console.log(this.name);
  }
};

person.greet();          // Output: Tunde   ← called as a method
const fn = person.greet;
fn();                    // Output: undefined  ← called as a plain function

function Car(make, model) {
  this.make  = make;     // Attach 'make' to the new object
  this.model = model;    // Attach 'model' to the new object
  this.describe = function() {
    return this.make + " " + this.model;
  };
}

const myCar = new Car("Toyota", "Corolla");
console.log(myCar.describe());   // Output: Toyota Corolla
console.log(myCar.make);         // Output: Toyota

const btn = document.getElementById("my-button");

btn.addEventListener("click", function() {
  console.log(this);           // Output: <button id="my-button">...</button>
  this.style.background = "red";  // Changes the clicked button's colour
});

const team = {
  name: "Dev Team",
  members: ["Alice", "Bob", "Charlie"],

  listMembers: function() {
    // 'this' here is 'team' (regular function as a method)
    this.members.forEach(member => {
      // Arrow function inherits 'this' from listMembers → 'this' is still 'team'
      console.log(member + " is on " + this.name);
    });
  }
};

team.listMembers();
// Output:
// Alice is on Dev Team
// Bob is on Dev Team
// Charlie is on Dev Team

listMembers: function() {
  this.members.forEach(function(member) {
    // Regular function — 'this' is now the global object, NOT 'team'
    console.log(member + " is on " + this.name);  // this.name is undefined!
  });
}

function.call(thisArg, arg1, arg2, ...)

function introduce() {
  console.log("Hi, I'm " + this.name + " and I'm " + this.age);
}

const alice = { name: "Alice", age: 30 };
const bob   = { name: "Bob",   age: 25 };

introduce.call(alice);   // Output: Hi, I'm Alice and I'm 30
introduce.call(bob);     // Output: Hi, I'm Bob and I'm 25

function greet(greeting, punctuation) {
  console.log(greeting + ", " + this.name + punctuation);
}

const person = { name: "Tunde" };

greet.call(person, "Hello", "!");    // Output: Hello, Tunde!
greet.call(person, "Good day", "."); // Output: Good day, Tunde.

const dog = {
  name: "Rex",
  speak: function(sound) {
    console.log(this.name + " says " + sound);
  }
};

const cat = { name: "Whiskers" };

// Borrow dog's speak method for cat:
dog.speak.call(cat, "Meow");   // Output: Whiskers says Meow

function toArray() {
  return Array.prototype.slice.call(arguments);
  // Borrow Array's slice method and call it on the arguments object
}

console.log(toArray(1, 2, 3));   // Output: [1, 2, 3]

function Animal(name, sound) {
  this.name  = name;
  this.sound = sound;
}

function Dog(name) {
  Animal.call(this, name, "Woof");  // Run Animal's constructor with Dog's 'this'
  this.type = "Dog";
}

const d = new Dog("Rex");
console.log(d.name);    // Output: Rex
console.log(d.sound);   // Output: Woof
console.log(d.type);    // Output: Dog

function.apply(thisArg, [arg1, arg2, ...])

function greet(greeting, punctuation) {
  console.log(greeting + ", " + this.name + punctuation);
}

const person = { name: "Tunde" };
const args = ["Hello", "!"];

greet.apply(person, args);   // Output: Hello, Tunde!

const scores = [85, 92, 78, 96, 88];

const highest = Math.max.apply(null, scores);
const lowest  = Math.min.apply(null, scores);

console.log(highest);   // Output: 96
console.log(lowest);    // Output: 78

const arrayA = [1, 2, 3];
const arrayB = [4, 5, 6];

Array.prototype.push.apply(arrayA, arrayB);
// Equivalent to: arrayA.push(4, 5, 6)

console.log(arrayA);   // Output: [1, 2, 3, 4, 5, 6]

fn.call(ctx, a, b, c);      // C = Comma
fn.apply(ctx, [a, b, c]);   // A = Array

const boundFunction = fn.bind(thisArg, arg1, arg2, ...);

const person = {
  name: "Tunde",
  greet: function() {
    console.log("Hello, I'm " + this.name);
  }
};

const greetTunde = person.greet.bind(person);

// Call it later:
greetTunde();    // Output: Hello, I'm Tunde
greetTunde();    // Output: Hello, I'm Tunde

const timer = {
  seconds: 0,
  start: function() {
    // ❌ Without bind: 'this' would be undefined or global inside setInterval
    setInterval(function() {
      this.seconds++;   // 'this' is NOT timer here!
      console.log(this.seconds);
    }, 1000);
  }
};

const timer = {
  seconds: 0,
  start: function() {
    setInterval(function() {
      this.seconds++;
      console.log(this.seconds);
    }.bind(this), 1000);   // Bind 'this' (which is 'timer' at the point of call)
  }
};

timer.start();
// Output (each second): 1, 2, 3, 4, ...

function multiply(a, b) {
  return a * b;
}

const double = multiply.bind(null, 2);   // Pre-fill 'a' with 2
const triple = multiply.bind(null, 3);   // Pre-fill 'a' with 3

console.log(double(5));    // Output: 10  (2 × 5)
console.log(double(10));   // Output: 20  (2 × 10)
console.log(triple(4));    // Output: 12  (3 × 4)

function formatCurrency(currencySymbol, amount) {
  return currencySymbol + amount.toFixed(2);
}

const formatUSD   = formatCurrency.bind(null, "$");
const formatEuros = formatCurrency.bind(null, "€");
const formatGBP   = formatCurrency.bind(null, "£");

console.log(formatUSD(19.99));    // Output: $19.99
console.log(formatEuros(24.5));   // Output: €24.50
console.log(formatGBP(9.95));     // Output: £9.95

function Button(label) {
  this.label = label;
  this.clickCount = 0;
}

Button.prototype.handleClick = function() {
  this.clickCount++;
  console.log(this.label + " clicked " + this.clickCount + " times");
};

const saveBtn = new Button("Save");
const deleteBtn = new Button("Delete");

document.getElementById("save-btn")
  .addEventListener("click", saveBtn.handleClick.bind(saveBtn));

document.getElementById("delete-btn")
  .addEventListener("click", deleteBtn.handleClick.bind(deleteBtn));

(function() {
  console.log("I run immediately!");
})();
// Output: I run immediately!

(  function() {        }  )  ()
│  │                   │  │  │
│  └── function body ──┘  │  └── call it now
│                          │
└─────── wrapping parens ──┘
   (turn the declaration into an expression)

var counter = 0;   // Global — any script on the page can access and corrupt this

function increment() {
  counter++;
}

(function() {
  var counter = 0;   // Trapped inside the IIFE — completely private

  function increment() {
    counter++;
    console.log(counter);
  }

  increment();   // Output: 1
  increment();   // Output: 2
})();

// console.log(counter);   // ❌ ReferenceError — counter doesn't exist out here

(function(name, version) {
  console.log("Loading " + name + " v" + version);
})("MyApp", "1.0.0");
// Output: Loading MyApp v1.0.0

(function(win, doc) {
  // Inside here, 'win' refers to the global window object
  // 'doc' refers to the document object
  win.myApp = {};                         // Attach app to global scope
  doc.getElementById("app").innerHTML = "Ready";
})(window, document);

(() => {
  console.log("Arrow IIFE!");
})();
// Output: Arrow IIFE!

const result = (function() {
  const a = 10;
  const b = 20;
  return a + b;
})();

console.log(result);   // Output: 30

const bankAccount = (function() {
  // Private — not accessible from outside
  let balance = 0;

  // Public interface — returned as an object
  return {
    deposit: function(amount) {
      if (amount > 0) balance += amount;
      console.log("Deposited £" + amount + ". Balance: £" + balance);
    },
    withdraw: function(amount) {
      if (amount > balance) {
        console.log("Insufficient funds.");
        return;
      }
      balance -= amount;
      console.log("Withdrew £" + amount + ". Balance: £" + balance);
    },
    getBalance: function() {
      return balance;
    }
  };
})();

bankAccount.deposit(100);    // Output: Deposited £100. Balance: £100
bankAccount.withdraw(30);    // Output: Withdrew £30. Balance: £70
console.log(bankAccount.getBalance());   // Output: 70
// console.log(bankAccount.balance);     // Output: undefined — 'balance' is private!

const outerVariable = "I'm outside";

function innerFunction() {
  console.log(outerVariable);   // Can access the outer variable
}

innerFunction();   // Output: I'm outside

function makeCounter() {
  let count = 0;      // This variable belongs to makeCounter

  return function() { // This inner function is returned — it's a closure
    count++;
    return count;
  };
}

const counter = makeCounter();  // makeCounter finishes running here

console.log(counter());   // Output: 1
console.log(counter());   // Output: 2
console.log(counter());   // Output: 3

function makeCounter() {
  let count = 0;
  return function() {
    count++;
    return count;
  };
}

const counter1 = makeCounter();
const counter2 = makeCounter();

console.log(counter1());   // Output: 1
console.log(counter1());   // Output: 2
console.log(counter2());   // Output: 1   ← counter2 has its OWN count, starting at 0
console.log(counter1());   // Output: 3   ← counter1 is still going

function makeAdder(x) {
  return function(y) {
    return x + y;   // x is captured from makeAdder's scope
  };
}

const add5  = makeAdder(5);
const add10 = makeAdder(10);

console.log(add5(3));     // Output: 8   (5 + 3)
console.log(add5(7));     // Output: 12  (5 + 7)
console.log(add10(3));    // Output: 13  (10 + 3)

function createPerson(name) {
  // 'name' is private — accessible only through the returned methods
  let _name = name;
  let _callCount = 0;

  return {
    getName: function() {
      _callCount++;
      return _name;
    },
    setName: function(newName) {
      if (typeof newName === "string" && newName.trim() !== "") {
        _name = newName;
      }
    },
    getCallCount: function() {
      return _callCount;
    }
  };
}

const person = createPerson("Alice");

console.log(person.getName());          // Output: Alice
console.log(person.getName());          // Output: Alice
console.log(person.getCallCount());     // Output: 2
person.setName("Bob");
console.log(person.getName());          // Output: Bob
// console.log(person._name);           // Output: undefined — truly private

// ❌ Bug: All buttons alert "3"
for (var i = 0; i < 3; i++) {
  const btn = document.createElement("button");
  btn.innerText = "Button " + i;
  btn.addEventListener("click", function() {
    alert("I am button " + i);   // By the time this runs, i is 3 (the loop ended)
  });
  document.body.appendChild(btn);
}
// Clicking any button → Alert: "I am button 3"

for (let i = 0; i < 3; i++) {   // 'let' creates a new i per iteration
  const btn = document.createElement("button");
  btn.innerText = "Button " + i;
  btn.addEventListener("click", function() {
    alert("I am button " + i);   // Each closure now has its own 'i'
  });
  document.body.appendChild(btn);
}
// Clicking Button 0 → Alert: "I am button 0"
// Clicking Button 1 → Alert: "I am button 1"
// Clicking Button 2 → Alert: "I am button 2"

for (var i = 0; i < 3; i++) {
  (function(j) {   // j is a new variable per iteration, capturing current i
    const btn = document.createElement("button");
    btn.innerText = "Button " + j;
    btn.addEventListener("click", function() {
      alert("I am button " + j);
    });
    document.body.appendChild(btn);
  })(i);
}

// useState in React returns a pair where the setter closes over the state
const [count, setCount] = useState(0);
// Every time setCount is called, it updates the closed-over 'count'

function setupHandler(userId) {
  document.getElementById("profile-btn").addEventListener("click", function() {
    fetchUserProfile(userId);   // userId is captured — no need to pass it explicitly
  });
}

setupHandler(42);   // The handler will always fetch user 42

// Send a message after 1, 2, and 3 seconds
[1, 2, 3].forEach(function(seconds) {
  setTimeout(function() {
    console.log("Message after " + seconds + " seconds");
    // 'seconds' is captured correctly because forEach callback creates a new scope
  }, seconds * 1000);
});

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

console.log(add.toString());
// Output:
// function add(a, b) {
//   return a + b;
// }

function f1(a, b, c) {}
function f2(a, b = 0, c) {}
function f3(a, ...rest) {}

console.log(f1.length);   // Output: 3
console.log(f2.length);   // Output: 1  (only 'a' counts — 'b' has a default)
console.log(f3.length);   // Output: 1  (only 'a' counts — rest doesn't count)

function greet() {}
const sayHi = function hello() {};
const arrow = () => {};
const obj = { method() {} };

console.log(greet.name);       // Output: greet
console.log(sayHi.name);       // Output: hello
console.log(arrow.name);       // Output: arrow
console.log(obj.method.name);  // Output: method

fn.call(thisArg, arg1, arg2, ...);
// Calls fn immediately, setting 'this' to thisArg

fn.apply(thisArg, [arg1, arg2, ...]);
// Calls fn immediately, passing args as an array

const boundFn = fn.bind(thisArg, arg1, arg2, ...);
// Returns a new function with 'this' and optional args pre-set

// Raw task data — simulating a real project's task list
const rawTasks = [
  { id: 1, title: "Write unit tests",       category: "dev",     hours: 3, done: false },
  { id: 2, title: "Design login screen",    category: "design",  hours: 5, done: false },
  { id: 3, title: "Fix payment bug",        category: "dev",     hours: 1, done: true  },
  { id: 4, title: "Update documentation",  category: "writing", hours: 2, done: false },
  { id: 5, title: "Code review",            category: "dev",     hours: 2, done: false },
  { id: 6, title: "Client presentation",   category: "meeting", hours: 4, done: true  },
  { id: 7, title: "Database optimisation", category: "dev",     hours: 6, done: false },
  { id: 8, title: "Write blog post",        category: "writing", hours: 3, done: false },
];

// Filter tasks by a predicate function
function filterTasks(tasks, predicate) {
  return tasks.filter(predicate);
}

// Transform tasks (map)
function transformTasks(tasks, transformer) {
  return tasks.map(transformer);
}

// Reduce tasks to a single value
function reduceTasks(tasks, reducer, initialValue) {
  return tasks.reduce(reducer, initialValue);
}

// Sort tasks by a key
function sortTasks(tasks, keyFn, ascending = true) {
  return [...tasks].sort((a, b) => {
    const valA = keyFn(a);
    const valB = keyFn(b);
    return ascending ? (valA > valB ? 1 : -1) : (valA < valB ? 1 : -1);
  });
}

const pendingTasks = filterTasks(rawTasks, task => !task.done);
console.log(pendingTasks.length);   // Output: 6

const totalHours = reduceTasks(rawTasks, (sum, t) => sum + t.hours, 0);
console.log(totalHours);   // Output: 26

function createPipeline(...steps) {
  // Each 'step' is a function that takes tasks and returns modified tasks
  return function(tasks) {
    return steps.reduce(function(currentTasks, step) {
      return step(currentTasks);
    }, tasks);
  };
}

// Step factories — each returns a function for use in the pipeline
const onlyPending   = tasks => filterTasks(tasks, t => !t.done);
const onlyDev       = tasks => filterTasks(tasks, t => t.category === "dev");
const byHoursAsc    = tasks => sortTasks(tasks, t => t.hours, true);
const byHoursDesc   = tasks => sortTasks(tasks, t => t.hours, false);

// Generalised filter step factory using closure:
function byCategoryStep(category) {
  return function(tasks) {
    return filterTasks(tasks, t => t.category === category);
  };
}

const addPriorityLabel = tasks => transformTasks(tasks, function(task) {
  const priority = task.hours >= 5 ? "HIGH"
                 : task.hours >= 3 ? "MEDIUM"
                 : "LOW";
  return { ...task, priority };
});

const devBacklogPipeline = createPipeline(
  onlyPending,
  onlyDev,
  addPriorityLabel,
  byHoursDesc
);

const results = devBacklogPipeline(rawTasks);
results.forEach(t => {
  console.log(`[${t.priority}] ${t.title} (${t.hours}h)`);
});
// Expected output:
// [HIGH] Database optimisation (6h)
// [MEDIUM] Write unit tests (3h)
// [LOW] Fix payment bug (1h)   ← wait, this is 'done:true' — it should be filtered out
// Actually: only pending dev tasks:
// [HIGH] Database optimisation (6h)
// [MEDIUM] Write unit tests (3h)
// [LOW] Code review (2h)

const TaskManager = (function() {
  // Private state
  let _tasks = [];
  let _history = [];
  let _nextId = 1;

  // Private helpers
  function _log(action, taskId) {
    _history.push({
      action,
      taskId,
      timestamp: new Date().toISOString()
    });
  }

  // Public API
  return {
    loadTasks: function(tasks) {
      _tasks = tasks.map(t => ({ ...t }));  // Store a copy, not the original
      _nextId = Math.max(..._tasks.map(t => t.id)) + 1;
      _log("LOAD", null);
    },

    addTask: function(title, category, hours) {
      const task = { id: _nextId++, title, category, hours, done: false };
      _tasks.push(task);
      _log("ADD", task.id);
      return task;
    },

    completeTask: function(id) {
      const task = _tasks.find(t => t.id === id);
      if (task) {
        task.done = true;
        _log("COMPLETE", id);
        return true;
      }
      return false;
    },

    runPipeline: function(pipeline) {
      return pipeline([..._tasks]);   // Pass a copy to the pipeline
    },

    getStats: function() {
      const total    = _tasks.length;
      const done     = _tasks.filter(t => t.done).length;
      const pending  = total - done;
      const totalHrs = reduceTasks(_tasks, (s, t) => s + t.hours, 0);
      const doneHrs  = reduceTasks(_tasks.filter(t => t.done), (s, t) => s + t.hours, 0);

      return { total, done, pending, totalHrs, doneHrs };
    },

    getHistory: function() {
      return [..._history];   // Return a copy
    }
  };
})();

TaskManager.loadTasks(rawTasks);

// Add a new task
TaskManager.addTask("Performance audit", "dev", 4);

// Complete a task
TaskManager.completeTask(4);

// Run a pipeline through the manager
const devPipeline = createPipeline(onlyPending, onlyDev, addPriorityLabel, byHoursDesc);
const devResults  = TaskManager.runPipeline(devPipeline);

console.log("Dev backlog:");
devResults.forEach(t => console.log(`  [${t.priority}] ${t.title}`));

// Stats
const stats = TaskManager.getStats();
console.log("\nProject Stats:");
console.log("  Total tasks:  " + stats.total);
console.log("  Done:         " + stats.done);
console.log("  Pending:      " + stats.pending);
console.log("  Total hours:  " + stats.totalHrs);

// History
console.log("\nAudit Trail:");
TaskManager.getHistory().forEach(entry => {
  console.log("  " + entry.action + (entry.taskId ? " #" + entry.taskId : "") + " at " + entry.timestamp);
});

Dev backlog:
  [HIGH] Database optimisation
  [HIGH] Performance audit
  [MEDIUM] Write unit tests
  [LOW] Code review

Project Stats:
  Total tasks:  9
  Done:         3
  Pending:      6
  Total hours:  30

Audit Trail:
  LOAD at 2024-...
  ADD #9 at 2024-...
  COMPLETE #4 at 2024-...

function debounce(fn, delayMs) {
  let timeoutId = null;   // Closed-over variable — persists between calls

  return function(...args) {
    // If the timer is already running, cancel it and restart
    clearTimeout(timeoutId);

    // Start a new timer
    timeoutId = setTimeout(() => {
      fn.apply(this, args);   // Use .apply() to preserve 'this' and pass args
      timeoutId = null;
    }, delayMs);
  };
}

function searchTasks(query) {
  const results = TaskManager.runPipeline(
    createPipeline(tasks => tasks.filter(t => t.title.toLowerCase().includes(query)))
  );
  console.log("Search '" + query + "':", results.map(t => t.title));
}

const debouncedSearch = debounce(searchTasks, 300);

// Simulate fast keystrokes:
debouncedSearch("w");
debouncedSearch("wr");
debouncedSearch("wri");
debouncedSearch("writ");
// Only "writ" search will actually run (the others were cancelled)
// Output: Search 'writ': ["Write unit tests", "Write blog post"]

const obj = { n: 5 };
function double() { return this.n * 2; }
console.log(double.call(obj));   // ?

function makeCounter() {
  let count = 0;
  return () => ++count;
}
const a = makeCounter();
const b = makeCounter();
a(); a();
console.log(a());   // ?
console.log(b());   // ?