// Scope difference
function scopeDemo() {
  if (true) {
    var x = 1;    // Function-scoped
    let y = 2;    // Block-scoped
    const z = 3;  // Block-scoped
  }
  console.log(x); // 1
  console.log(y); // ReferenceError
  console.log(z); // ReferenceError
}

// Hoisting difference
console.log(a); // undefined (hoisted)
console.log(b); // ReferenceError (TDZ)
var a = 1;
let b = 2;

// const with objects (reference is constant, not value)
const obj = { name: 'John' };
obj.name = 'Jane';  // Allowed
obj = {};           // TypeError

// Loose equality (==) - Type coercion happens
0 == '0'           // true (string '0' coerced to number)
0 == false         // true (false coerced to 0)
null == undefined  // true (special case)
'' == false        // true
[] == false        // true
[] == 0            // true

// Strict equality (===) - No coercion
0 === '0'          // false
0 === false        // false
null === undefined // false
'' === false       // false

// Best Practice: Always use === unless you explicitly need coercion

// var hoisting
console.log(x); // undefined (declaration hoisted, not initialization)
var x = 5;

// let/const TDZ
console.log(y); // ReferenceError: Cannot access 'y' before initialization
let y = 10;     // TDZ ends here

// Function hoisting (fully hoisted)
greet(); // "Hello!" - works
function greet() {
  console.log("Hello!");
}

// Function expression (not hoisted)
sayHi(); // TypeError: sayHi is not a function
var sayHi = function() {
  console.log("Hi!");
};

// Basic closure
function outer() {
  let count = 0;
  return function inner() {
    count++;
    return count;
  };
}

const counter = outer();
console.log(counter()); // 1
console.log(counter()); // 2
console.log(counter()); // 3

// Practical example: Private variables
function createBankAccount(initialBalance) {
  let balance = initialBalance; // Private variable

  return {
    deposit(amount) {
      balance += amount;
      return balance;
    },
    withdraw(amount) {
      if (amount > balance) throw new Error('Insufficient funds');
      balance -= amount;
      return balance;
    },
    getBalance() {
      return balance;
    }
  };
}

const account = createBankAccount(100);
account.deposit(50);  // 150
account.withdraw(30); // 120
// account.balance is not accessible directly (private)

// Closure in loops (common interview question)
for (var i = 0; i < 3; i++) {
  setTimeout(() => console.log(i), 100); // 3, 3, 3
}

// Fix with let (creates new scope each iteration)
for (let i = 0; i < 3; i++) {
  setTimeout(() => console.log(i), 100); // 0, 1, 2
}

// Fix with IIFE (Immediately Invoked Function Expression)
for (var i = 0; i < 3; i++) {
  ((j) => {
    setTimeout(() => console.log(j), 100);
  })(i); // 0, 1, 2
}

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

// Solution 2: IIFE (creates new scope)
for (var i = 0; i < 3; i++) {
  ((j) => {
    setTimeout(() => console.log(j), 1000);
  })(i);
}

// Solution 3: setTimeout third parameter
for (var i = 0; i < 3; i++) {
  setTimeout((j) => console.log(j), 1000, i);
}

// Promise-based approach
function fetchUserPromise(id) {
  return fetch(`/api/users/${id}`)
    .then(response => response.json())
    .then(user => {
      console.log(user);
      return user;
    })
    .catch(error => {
      console.error('Error:', error);
      throw error;
    });
}

// async/await approach (cleaner syntax)
async function fetchUserAsync(id) {
  try {
    const response = await fetch(`/api/users/${id}`);
    const user = await response.json();
    console.log(user);
    return user;
  } catch (error) {
    console.error('Error:', error);
    throw error;
  }
}

// Promise methods
Promise.all([p1, p2, p3]);     // Wait for all, fail if any fails
Promise.allSettled([p1, p2]);  // Wait for all, get all results
Promise.race([p1, p2]);        // First to settle wins
Promise.any([p1, p2]);         // First to fulfill wins

// Sequential vs Parallel execution
// Sequential (slower)
async function sequential() {
  const user = await getUser();
  const posts = await getPosts(); // Waits for user first
  return { user, posts };
}

// Parallel (faster)
async function parallel() {
  const [user, posts] = await Promise.all([
    getUser(),
    getPosts()
  ]);
  return { user, posts };
}

console.log('1');

setTimeout(() => {
  console.log('2');
}, 0);

Promise.resolve().then(() => {
  console.log('3');
});

console.log('4');

// Output: 1, 4, 3, 2
// Explanation:
// 1. '1' - synchronous, runs immediately
// 2. setTimeout callback goes to macrotask queue
// 3. Promise.then goes to microtask queue
// 4. '4' - synchronous, runs immediately
// 5. Call stack empty, check microtask queue → '3'
// 6. Microtask queue empty, check macrotask queue → '2'

// Shallow Copy - copies only first level, nested objects are referenced
const original = { a: 1, nested: { b: 2 } };

// Shallow copy methods
const shallow1 = { ...original };
const shallow2 = Object.assign({}, original);

shallow1.nested.b = 999;
console.log(original.nested.b); // 999 (affected!)

// Deep Copy - copies all levels
const original2 = { a: 1, nested: { b: 2 } };

// Method 1: JSON (simple but has limitations)
const deep1 = JSON.parse(JSON.stringify(original2));
// Limitations: loses functions, undefined, Date becomes string, circular refs fail

// Method 2: structuredClone (modern, recommended)
const deep2 = structuredClone(original2);

// Method 3: Custom recursive function
function deepClone(obj) {
  if (obj === null || typeof obj !== 'object') {
    return obj;
  }

  if (Array.isArray(obj)) {
    return obj.map(item => deepClone(item));
  }

  const cloned = {};
  for (const key in obj) {
    if (obj.hasOwnProperty(key)) {
      cloned[key] = deepClone(obj[key]);
    }
  }
  return cloned;
}

deep2.nested.b = 999;
console.log(original2.nested.b); // 2 (not affected)

// 1. Global context
console.log(this); // window (browser) or global (Node)

// 2. Object method - this = object
const obj = {
  name: 'John',
  greet() {
    console.log(this.name); // 'John'
  }
};

// 3. Regular function - this = undefined (strict) or global
function regularFunc() {
  console.log(this); // undefined in strict mode
}

// 4. Arrow function - this = lexically inherited (from enclosing scope)
const obj2 = {
  name: 'Jane',
  greet: () => {
    console.log(this.name); // undefined (inherits from outer scope)
  },
  greetCorrect() {
    const arrow = () => console.log(this.name);
    arrow(); // 'Jane' (inherits from greetCorrect)
  }
};

// 5. Event handler - this = element that received event
button.addEventListener('click', function() {
  console.log(this); // button element
});

// 6. Explicit binding - call, apply, bind
function greet(greeting) {
  console.log(`${greeting}, ${this.name}`);
}

const person = { name: 'Alice' };

greet.call(person, 'Hello');    // 'Hello, Alice'
greet.apply(person, ['Hi']);    // 'Hi, Alice'
const boundGreet = greet.bind(person);
boundGreet('Hey');              // 'Hey, Alice'

// Every object has a prototype chain
const arr = [1, 2, 3];
// arr → Array.prototype → Object.prototype → null

// Constructor function pattern
function Animal(name) {
  this.name = name;
}

Animal.prototype.speak = function() {
  console.log(`${this.name} makes a sound`);
};

function Dog(name, breed) {
  Animal.call(this, name); // Call parent constructor
  this.breed = breed;
}

// Set up inheritance
Dog.prototype = Object.create(Animal.prototype);
Dog.prototype.constructor = Dog;

Dog.prototype.bark = function() {
  console.log(`${this.name} barks!`);
};

const dog = new Dog('Rex', 'German Shepherd');
dog.speak(); // 'Rex makes a sound' (inherited)
dog.bark();  // 'Rex barks!'

// ES6 Class syntax (syntactic sugar over prototypes)
class AnimalClass {
  constructor(name) {
    this.name = name;
  }
  speak() {
    console.log(`${this.name} makes a sound`);
  }
}

class DogClass extends AnimalClass {
  constructor(name, breed) {
    super(name);
    this.breed = breed;
  }
  bark() {
    console.log(`${this.name} barks!`);
  }
}

// Checking prototype chain
console.log(dog instanceof Dog);    // true
console.log(dog instanceof Animal); // true
console.log(Dog.prototype.isPrototypeOf(dog)); // true

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

// forEach - executes function for each element, returns undefined
// Use: side effects (logging, DOM manipulation)
numbers.forEach((num, index) => {
  console.log(`Index ${index}: ${num}`);
});
// Returns: undefined

// map - transforms each element, returns new array
// Use: transforming data
const doubled = numbers.map(num => num * 2);
// Returns: [2, 4, 6, 8, 10]

// filter - keeps elements that pass test, returns new array
// Use: filtering data based on condition
const evens = numbers.filter(num => num % 2 === 0);
// Returns: [2, 4]

// reduce - accumulates values into single result
// Use: summing, grouping, transforming to different structure
const sum = numbers.reduce((acc, num) => acc + num, 0);
// Returns: 15

// Chaining example
const result = numbers
  .filter(num => num > 2)      // [3, 4, 5]
  .map(num => num * 2)         // [6, 8, 10]
  .reduce((sum, n) => sum + n, 0); // 24

// Key differences:
// | Method  | Returns     | Mutates | Use Case           |
// |---------|-------------|---------|-------------------|
// | forEach | undefined   | No      | Side effects      |
// | map     | New array   | No      | Transform data    |
// | filter  | New array   | No      | Select subset     |
// | reduce  | Any value   | No      | Accumulate/aggregate |