const BASE_URL = 'https://api.example.com'  // Global environment record

function createClient(key) {                 // createClient's environment record: { key }
  const prefix = '/v2'                       // ← prefix is in createClient's env record

  function get(path) {                       // get's environment record: { path }
    // Resolving BASE_URL:
    // 1. Look in get's env record → not found
    // 2. Follow outer pointer → createClient's env record → not found
    // 3. Follow outer pointer → global env record → found: 'https://api.example.com'
    return fetch(`${BASE_URL}${prefix}${path}`, {
      headers: { Authorization: `Bearer ${key}` }
      //                                    ↑
      // key: look in get's record → not found
      //      look in createClient's record → found
    })
  }

  return get
}

// ❌ The classic var hoisting trap
console.log(x)    // undefined — var x allocated in creation phase, value not yet assigned
var x = 42
console.log(x)    // 42

// ✅ let/const enforces TDZ — reading before declaration is a ReferenceError
console.log(y)    // ReferenceError: Cannot access 'y' before initialization
let y = 42

// Function declarations: FULLY hoisted (entire body available before any code runs)
greet()  // ✅ Works — 'greet' initialized to its full body in creation phase

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

// Function expressions: NOT hoisted (only the variable binding is hoisted)
sayHi()  // ❌ TypeError: sayHi is not a function
         // 'sayHi' was allocated as undefined (var) in creation phase
var sayHi = function () {
  console.log('Hi')
}

// Class declarations: TDZ — like let/const
new Point(1, 2)  // ❌ ReferenceError: Cannot access 'Point' before initialization
class Point {
  constructor(x, y) { this.x = x; this.y = y }
}

// GC Root: global scope variable
let user = { name: 'Alice', cart: { items: [] } }

// Both user AND user.cart are reachable → both survive GC

user = null
// user is now null — the { name: 'Alice', cart: ... } object has no reference from roots
// On next GC: object is unmarked → swept → memory reclaimed

// BUT: if another variable still holds a reference...
let savedCart = user  // savedCart → { name: 'Alice', cart: ... }
user = null
// user is null, but savedCart still references the object
// Object is still reachable → NOT collected

// ❌ Classic DOM leak — detached subtree
let listContainer = document.getElementById('item-list')
const items = Array.from(listContainer.children)
// items[] holds references to all li elements

document.body.removeChild(listContainer)
// listContainer is removed from the DOM, but items[] still holds
// references to the li elements — the entire subtree is NOT collected.
// The detached tree survives in memory indefinitely.

// ✅ Nullify references when done
document.body.removeChild(listContainer)
listContainer = null
items.length = 0  // Clear the array — li elements now unreachable → GC eligible

// ❌ Interval never cleared — callback keeps running + keeps references alive
function startPolling(endpoint) {
  const interval = setInterval(async () => {
    const data = await fetch(endpoint)
    updateUI(data)
  }, 5000)
  // interval is never returned or stored — can never be cleared
}

// ✅ Return the cleanup function
function startPolling(endpoint) {
  const interval = setInterval(async () => {
    const data = await fetch(endpoint)
    updateUI(data)
  }, 5000)
  return () => clearInterval(interval)  // Caller is responsible for cleanup
}

// In React: use the useEffect cleanup return
useEffect(() => {
  const cleanup = startPolling('/api/status')
  return cleanup  // Called on unmount — interval cleared, GC can collect
}, [])

// ❌ Event log grows unboundedly — every request appended, never cleared
const requestLog: Request[] = []

app.use((req, res, next) => {
  requestLog.push(req)  // req holds headers, body, socket — large object
  next()
})

// ✅ Cap the log size
const MAX_LOG = 1000
app.use((req, res, next) => {
  requestLog.push(req)
  if (requestLog.length > MAX_LOG) requestLog.shift()  // Evict oldest
  next()
})

// ✅ Data privacy via closure — counter is inaccessible from outside
function createCounter(start = 0) {
  let count = start  // Captured in the closure's lexical environment

  return {
    increment: () => ++count,
    decrement: () => --count,
    value: () => count,
  }
}

const counter = createCounter(10)
counter.increment()  // 11
counter.increment()  // 12
counter.value()      // 12
// count is unreachable from outside — no global pollution, no accidental mutation

// ✅ Functional currying — partial application via closure
function multiply(factor: number) {
  return (value: number) => value * factor  // factor captured in closure
}

const double = multiply(2)
const triple = multiply(3)
double(5)  // 10
triple(5)  // 15
// Each returned function is a separate closure with its own captured `factor`

// ❌ Closure captures entire scope — large data retained unnecessarily
function processReport(data: ReportData[]) {
  const processedRows = data.map(row => expensiveTransform(row))
  // processedRows: potentially megabytes of data in memory

  const summary = computeSummary(processedRows)

  // ❌ This closure captures the entire scope of processReport
  // — including processedRows — even though it only needs summary
  return function getStatus() {
    return summary.status  // Only uses summary
    // But processedRows is ALSO retained — GC cannot collect it
    // as long as getStatus closure is alive
  }
}

// ✅ Scope isolation — break the closure chain
function processReport(data: ReportData[]) {
  const processedRows = data.map(row => expensiveTransform(row))
  const summary = computeSummary(processedRows)

  // ✅ Create the closure in a nested scope that does NOT capture processedRows
  return createStatusChecker(summary)
  // processedRows is no longer referenced → GC eligible after processReport returns
}

function createStatusChecker(summary: Summary) {
  return function getStatus() {
    return summary.status  // Only summary's environment record is retained
  }
}

// Node.js: capture heap snapshot
const v8 = require('v8')
const fs = require('fs')

const snapshot = v8.writeHeapSnapshot()
// Produces: Heap.{timestamp}.heapprofile
// Open in Chrome DevTools → Memory tab → Load profile