Functions

// 1. Declaration — hoisted: usable before the line it is written on
console.log(greet("Ada"))
function greet(name) {
  return `Hello, ${name}!`
}

// 2. Expression — a function stored in a const; not hoisted
const shout = function (text) {
  return text.toUpperCase() + "!"
}
console.log(shout("hi"))

// 3. Arrow — concise; the body is an expression when there are no braces
const square = x => x * x
const add = (a, b) => a + b
const makeUser = (name, age) => ({ name, age })   // parentheses to return an object literal
const nothing = () => {}                           // braces = a block; returns undefined
console.log(square(4), add(2, 3), makeUser("Ada", 36), nothing())

// Functions are values
const ops = { double: x => x * 2, negate: x => -x }
console.log(ops.double(5), [1, 2, 3].map(square), typeof square)

// No return → undefined
function log(x) { console.log("logging", x) }
console.log(log("a"))

// Missing arguments are undefined; extras are ignored
function show(a, b) { console.log(a, b) }
show(1)
show(1, 2, 3)

// Default values — evaluated when the argument is undefined
function connect(host = "localhost", port = 5432, ssl = port === 443) {
  return `${host}:${port} ssl=${ssl}`
}
console.log(connect(), connect("db.internal", 443), connect(undefined, 8080))

// Rest: gather the remaining arguments into a real array
function sum(...nums) {
  return nums.reduce((acc, n) => acc + n, 0)
}
console.log(sum(), sum(1, 2, 3), sum(...[4, 5]))   // spread on the way in

// Destructured parameters — named options, any order, with defaults
function createUser({ name, role = "viewer", tags = [] } = {}) {
  return `${name} (${role}) ${tags.length} tags`
}
console.log(createUser({ name: "Ada", tags: ["x"] }), createUser({ role: "admin", name: "Bob" }), createUser())

// Arrays too
const distance = ([x1, y1], [x2, y2]) => Math.hypot(x2 - x1, y2 - y1)
console.log(distance([0, 0], [3, 4]))

// Callbacks are just function parameters
function repeat(times, action) {
  for (let i = 0; i < times; i++) action(i)
}
repeat(3, i => console.log("tick", i))

// Arguments are passed by value — but an object's value IS a reference
function rename(user) { user.name = "changed" }
function reassign(user) { user = { name: "new" } }
const u = { name: "Ada" }
rename(u); console.log(u.name)
reassign(u); console.log(u.name)

const level = "global"

function outer() {
  const level = "outer"          // shadows the global one inside here
  function inner() {
    console.log("inner sees", level)   // looks outward: finds "outer"
  }
  inner()
}
outer()
console.log("top sees", level)

// Block scope
{
  const hidden = 1
  let alsoHidden = 2
  var notHidden = 3
}
console.log(typeof hidden, typeof alsoHidden, notHidden)

// Hoisting
console.log(typeof hoistedFn, hoistedVar)   // function, undefined
function hoistedFn() {}
var hoistedVar = 1

// Temporal dead zone: let/const exist but cannot be touched yet
try {
  console.log(tdz)
} catch (e) {
  console.log(e.name)
}
let tdz = "now fine"
console.log(tdz)

// The classic var-in-loop bug, and why let fixes it
var fnsVar = [], fnsLet = []
for (var i = 0; i < 3; i++) fnsVar.push(() => i)
for (let j = 0; j < 3; j++) fnsLet.push(() => j)
console.log(fnsVar.map(f => f()), fnsLet.map(f => f()))

function makeCounter() {
  let count = 0                   // lives in makeCounter's scope
  return function () {
    count += 1                    // …but this function still reaches it
    return count
  }
}
const next = makeCounter()
console.log(next(), next(), next())

const other = makeCounter()       // a fresh scope, a fresh count
console.log(other(), next())

// Private state with an object of closures
function makeAccount(balance) {
  return {
    deposit: amount => (balance += amount),
    get: () => balance,
  }
}
const acct = makeAccount(100)
acct.deposit(50)
console.log(acct.get(), acct.balance)   // no way to touch balance directly

// Function factories
const multiplier = factor => n => n * factor
const double = multiplier(2), triple = multiplier(3)
console.log(double(5), triple(5))

// once(): run a function only the first time
function once(fn) {
  let done = false, result
  return (...args) => {
    if (!done) { done = true; result = fn(...args) }
    return result
  }
}
const init = once(() => { console.log("initialising"); return 42 })
console.log(init(), init())

// memoize(): cache results by argument
function memoize(fn) {
  const cache = new Map()
  return n => {
    if (!cache.has(n)) cache.set(n, fn(n))
    return cache.get(n)
  }
}
let calls = 0
const slowSquare = memoize(n => { calls++; return n * n })
console.log(slowSquare(4), slowSquare(4), slowSquare(5), "computed", calls, "times")

const user = {
  name: "Ada",
  greet() { return `hi, I am ${this.name}` },             // rule 1: this = user
  greetArrow: () => `arrow sees ${typeof this}`,          // rule 4: no own this
  later() {
    // an arrow INSIDE a method keeps the method's this — the standard fix for callbacks
    return [1, 2].map(n => `${this.name}-${n}`)
  },
}
console.log(user.greet())
console.log(user.greetArrow())
console.log(user.later())

// Rule 1 in reverse: detach the method and this is lost.
// (In strict mode — modules, classes — this is undefined and this.name THROWS; see the error card.)
const detached = user.greet
console.log(detached())

// bind / call / apply set this explicitly
const bound = user.greet.bind({ name: "Bound" })
console.log(bound(), user.greet.call({ name: "Called" }), user.greet.apply({ name: "Applied" }, []))

// The callback problem, and the fixes
class Button {
  constructor(label) { this.label = label }
  clickPlain() { return this?.label }             // loses this when passed as a callback
  clickArrow = () => this.label                  // class field arrow: this is fixed
}
const b = new Button("Save")
const run = fn => fn()
console.log(run(b.clickPlain), run(b.clickArrow), run(b.clickPlain.bind(b)))

function factorial(n) {
  if (n <= 1) return 1              // base case
  return n * factorial(n - 1)       // step
}
console.log(factorial(5))

// Nested data: total size of a folder tree
const tree = { name: "root", size: 1, children: [
  { name: "a", size: 10, children: [] },
  { name: "b", size: 5, children: [{ name: "c", size: 20, children: [] }] },
] }
function totalSize(node) {
  return node.size + node.children.reduce((sum, child) => sum + totalSize(child), 0)
}
console.log(totalSize(tree))

// Flatten arbitrarily nested arrays
const flatten = arr => arr.reduce((out, x) => out.concat(Array.isArray(x) ? flatten(x) : x), [])
console.log(flatten([1, [2, [3, [4]], 5]]))

// Deep key count in any JSON-like value
function countKeys(v) {
  if (Array.isArray(v)) return v.reduce((n, x) => n + countKeys(x), 0)
  if (v && typeof v === "object") return Object.values(v).reduce((n, x) => n + countKeys(x), Object.keys(v).length)
  return 0
}
console.log(countKeys({ a: 1, b: { c: 2, d: [{ e: 3 }] } }))

// Every recursion can be a loop with an explicit stack
function totalSizeIter(root) {
  let total = 0
  const stack = [root]
  while (stack.length) {
    const node = stack.pop()
    total += node.size
    stack.push(...node.children)
  }
  return total
}
console.log(totalSizeIter(tree))

const orders = [
  { id: 1, customer: "ada", total: 120, status: "paid" },
  { id: 2, customer: "bob", total: 80, status: "pending" },
  { id: 3, customer: "ada", total: 45, status: "paid" },
  { id: 4, customer: "cy", total: 200, status: "refunded" },
]

console.log(orders.map(o => o.total))
console.log(orders.filter(o => o.status === "paid").map(o => o.id))
console.log(orders.reduce((sum, o) => sum + o.total, 0))

console.log(orders.find(o => o.total > 100)?.customer, orders.findIndex(o => o.customer === "cy"))
console.log(orders.some(o => o.status === "refunded"), orders.every(o => o.total > 0))

// Chaining reads top to bottom
const paidRevenueByCustomer = orders
  .filter(o => o.status === "paid")
  .reduce((acc, o) => {
    acc[o.customer] = (acc[o.customer] ?? 0) + o.total
    return acc
  }, {})
console.log(paidRevenueByCustomer)

// Sorting a copy by a key, then taking the top 2
console.log(orders.toSorted((a, b) => b.total - a.total).slice(0, 2).map(o => o.id))

// reduce can build anything: max, groups, a Map, a lookup
console.log(orders.reduce((best, o) => (o.total > best.total ? o : best)).id)
console.log(Object.fromEntries(orders.map(o => [o.id, o.customer])))

// flatMap, and the index argument
console.log([[1, 2], [3]].flatMap(x => x), ["a", "b"].map((x, i) => `${i}:${x}`))

// Writing your own higher-order function
const pipe = (...fns) => x => fns.reduce((v, f) => f(v), x)
const slugify = pipe(s => s.trim(), s => s.toLowerCase(), s => s.replace(/\s+/g, "-"))
console.log(slugify("  Hello World  "))