Functions

---
name: functions
description: Advanced function patterns including declaration styles, closures, scope chains, hoisting, and this binding. Master function composition and advanced techniques.
sasmp_version: "1.3.0"
bonded_agent: 02-functions-scope
bond_type: PRIMARY_BOND

# Production-Grade Configuration
skill_type: reference
response_format: code_first
max_tokens: 1500

parameter_validation:
  required: [topic]
  optional: [pattern_type]

retry_logic:
  on_ambiguity: ask_clarification
  fallback: show_common_patterns

observability:
  entry_log: "Functions skill activated"
  exit_log: "Function reference provided"
---

# Functions & Scope Skill

## Quick Reference Card

### Function Styles
```javascript
// Declaration (hoisted)
function greet(name) { return `Hello, ${name}!`; }

// Expression (not hoisted)
const greet = function(name) { return `Hello, ${name}!`; };

// Arrow (lexical this)
const greet = (name) => `Hello, ${name}!`;
const greet = name => `Hello, ${name}!`;  // Single param
const getUser = async (id) => await fetch(`/api/${id}`);
```

### Scope Rules
```
Global Scope
  └── Function Scope
        └── Block Scope (let/const)
```

```javascript
const global = 'accessible everywhere';

function outer() {
  const outerVar = 'accessible in outer + inner';

  function inner() {
    const innerVar = 'only accessible here';
    console.log(global, outerVar, innerVar); // All work
  }
}
```

### Closure Pattern
```javascript
function createCounter() {
  let count = 0;  // Private state

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

const counter = createCounter();
counter.increment(); // 1
counter.increment(); // 2
```

### This Binding Rules
| Context | `this` Value |
|---------|--------------|
| Global | `window`/`global` |
| Object method | The object |
| Arrow function | Lexical (outer) |
| `call/apply/bind` | Explicit value |
| Constructor (`new`) | New instance |

```javascript
// Explicit binding
fn.call(thisArg, arg1, arg2);
fn.apply(thisArg, [args]);
const bound = fn.bind(thisArg);
```

### Advanced Patterns
```javascript
// IIFE (Immediately Invoked)
const module = (function() {
  const private = 'hidden';
  return { getPrivate: () => private };
})();

// Currying
const multiply = a => b => a * b;
const double = multiply(2);
double(5); // 10

// Memoization
function memoize(fn) {
  const cache = new Map();
  return (...args) => {
    const key = JSON.stringify(args);
    if (!cache.has(key)) cache.set(key, fn(...args));
    return cache.get(key);
  };
}
```

## Troubleshooting

### Common Issues

| Problem | Symptom | Fix |
|---------|---------|-----|
| Lost `this` | `undefined` or wrong value | Use arrow fn or `.bind()` |
| Closure loop bug | All callbacks same value | Use `let` not `var` |
| Hoisting confusion | Undefined before declaration | Declare at top |
| TDZ error | ReferenceError | Move `let`/`const` before use |

### The Classic Loop Bug
```javascript
// BUG: var is function-scoped
for (var i = 0; i < 3; i++) {
  setTimeout(() => console.log(i), 100);
}
// Output: 3, 3, 3

// FIX: Use let (block-scoped)
for (let i = 0; i < 3; i++) {
  setTimeout(() => console.log(i), 100);
}
// Output: 0, 1, 2
```

### Debug Checklist
```javascript
// 1. Check this context
console.log('this is:', this);

// 2. Verify closure captures
function test() {
  let x = 1;
  return () => { console.log('x:', x); };
}

// 3. Check hoisting
console.log(typeof myFunc); // 'function' or 'undefined'?
```

## Production Patterns

### Factory Pattern
```javascript
function createLogger(prefix) {
  return {
    log: (msg) => console.log(`[${prefix}] ${msg}`),
    error: (msg) => console.error(`[${prefix}] ${msg}`)
  };
}

const apiLogger = createLogger('API');
apiLogger.log('Request received');
```

### Debounce/Throttle
```javascript
function debounce(fn, delay) {
  let timeoutId;
  return (...args) => {
    clearTimeout(timeoutId);
    timeoutId = setTimeout(() => fn(...args), delay);
  };
}
```

## Related

- **Agent 02**: Functions & Scope (detailed learning)
- **Skill: fundamentals**: Variables and basics
- **Skill: asynchronous**: Async functions