// 1. Declaration - hoisted completely, name and body.
function area(w, h) { return w * h; }

// 2. Expression assigned to a const - the binding is hoisted, the
//    value is not, so it exists but cannot be used before this line.
const volume = function (w, h, d) { return w * h * d; };

// 3. Arrow - same hoisting as 2, but no own this, arguments or
//    prototype, and it cannot be used with new.
const perimeter = (w, h) => 2 * (w + h);

// 4. Method shorthand in an object or class.
const shape = {
  w: 3, h: 4,
  area() { return this.w * this.h; },
};

console.log(declared());    // 'works' - function declarations are complete
console.log(hoistedVar);    // undefined - the binding exists, holds undefined

// The third case throws, so it is caught here rather than ending the
// example. Delete the try to see it stop the file.
try {
  console.log(letBinding);
} catch (error) {
  console.log(error.constructor.name);   // 'ReferenceError'
}

function declared() { return 'works'; }
var hoistedVar = 1;
let letBinding = 2;

// The loop everyone has met.
const withVar = [];
for (var i = 0; i < 3; i++) withVar.push(() => i);
console.log(withVar.map((f) => f()));   // [3, 3, 3] - one shared i

const withLet = [];
for (let j = 0; j < 3; j++) withLet.push(() => j);
console.log(withLet.map((f) => f()));   // [0, 1, 2] - a fresh j each pass

const outer = 'module';

function middle() {
  const outer = 'middle';
  return inner();        // calls inner, but inner cannot see this one
}

function inner() {
  return outer;          // 'module' - where inner was written
}

console.log(middle());   // 'module'

const counter = {
  count: 0,
  increment() { this.count++; return this.count; },
};

counter.increment();            // this === counter, because of 'counter.'

const loose = counter.increment;
// loose();                     // this is undefined in a module - TypeError

loose.call(counter);            // explicit: this === counter
const bound = counter.increment.bind(counter);
bound();                        // this === counter, permanently

const timer = {
  seconds: 0,
  // Right: the arrow keeps the method's this.
  startGood() { setInterval(() => { this.seconds++; }, 1000); },
  // Wrong: the ordinary function is called bare, so this is undefined.
  startBad() { setInterval(function () { this.seconds++; }, 1000); },
  // Wrong in a different way: an arrow as a method has no object this.
  reset: () => { this.seconds = 0; },
};

// A small event emitter, exercising scope, this, and closures together.
function createEmitter() {
  // Private to every emitter, by closure rather than convention.
  const handlers = new Map();

  return {
    on(event, handler) {
      if (!handlers.has(event)) handlers.set(event, new Set());
      handlers.get(event).add(handler);
      // Return an unsubscribe closure over the exact handler.
      return () => handlers.get(event).delete(handler);
    },

    emit(event, payload) {
      const set = handlers.get(event);
      if (!set) return 0;
      // A copy, so a handler that unsubscribes during emit is safe.
      for (const handler of [...set]) handler(payload);
      return set.size;
    },

    get count() {
      let total = 0;
      for (const set of handlers.values()) total += set.size;
      return total;
    },
  };
}

const bus = createEmitter();

const log = [];
const off = bus.on('save', (p) => log.push('first: ' + p));
bus.on('save', (p) => log.push('second: ' + p));

bus.emit('save', 'doc-1');
console.log(log);            // ['first: doc-1', 'second: doc-1']
console.log(bus.count);      // 2

off();                       // the closure remembers which handler
bus.emit('save', 'doc-2');
console.log(log);            // ...plus 'second: doc-2' only
console.log(bus.count);      // 1

// Now the this trap, demonstrated rather than described.
const listener = {
  seen: [],
  handle(p) { this.seen.push(p); },
};

// Passed as a value, the dot is left behind and this is undefined.
try {
  listener.handle.call(undefined, 'doc-3');
} catch (error) {
  console.log(error.constructor.name);       // 'TypeError'
}

// The fix: keep the dot by wrapping the call, or bind it once.
bus.on('save', (p) => listener.handle(p));
bus.emit('save', 'doc-4');
console.log(listener.seen);                  // ['doc-4']

// Defaults are evaluated at call time, left to right, and can refer
// to earlier parameters.
function slice(list, start = 0, end = list.length) {
  return list.slice(start, end);
}

// Rest collects the remainder into a real array - unlike arguments,
// which is array-like and absent from arrow functions.
function tally(label, ...amounts) {
  return label + ': ' + amounts.reduce((a, b) => a + b, 0);
}
console.log(tally('total', 1, 2, 3));   // 'total: 6'

// Only parameters before the first default count towards length.
console.log(slice.length);              // 1
console.log(tally.length);              // 1