var x = 5; // Function-scoped variable (avoid using in modern JavaScript)
let y = 10; // Block-scoped variable
const MAX_POINTS = 100; // Constant (cannot be reassigned)

let num = 42; // Number
let float = 3.14; // Number (JavaScript doesn't distinguish between integers and floats)
let str = "Hello, World!"; // String
let bool = true; // Boolean
let nullValue = null; // Null
let undefinedValue; // Undefined
let symbol = Symbol("unique"); // Symbol (ES6+)
let bigInt = 1234567890123456789012345678901234567890n; // BigInt (ES11+)

// Arithmetic Operators
let sum = 5 + 3;      // Addition: 8
let diff = 10 - 4;    // Subtraction: 6
let product = 3 * 4;  // Multiplication: 12
let quotient = 15 / 3;// Division: 5
let remainder = 17 % 5;// Modulus: 2
let power = 2 ** 3;   // Exponentiation: 8
let increment = 5;
increment++;          // Increment: 6
let decrement = 5;
decrement--;          // Decrement: 4

// Assignment Operators
let x = 10;           // Basic assignment
x += 5;               // Addition assignment (x = x + 5)
x -= 3;               // Subtraction assignment
x *= 2;               // Multiplication assignment
x /= 4;               // Division assignment
x %= 3;               // Modulus assignment
x **= 2;              // Exponentiation assignment

// Comparison Operators
console.log(5 == "5");   // Equal to (with type coercion): true
console.log(5 === "5");  // Strictly equal to: false
console.log(7 != "7");   // Not equal to: false
console.log(7 !== "7");  // Strictly not equal to: true
console.log(10 > 5);     // Greater than: true
console.log(10 >= 10);   // Greater than or equal to: true
console.log(5 < 10);     // Less than: true
console.log(5 <= 5);     // Less than or equal to: true

// Logical Operators
let a = true, b = false;
console.log(a && b);     // Logical AND: false
console.log(a || b);     // Logical OR: true
console.log(!a);         // Logical NOT: false

// Nullish Coalescing Operator (ES2020)
let nullValue = null;
let defaultValue = nullValue ?? "default"; // "default"

// Optional Chaining Operator (ES2020)
let user = {
    address: {
        street: "123 Main St"
    }
};
console.log(user?.address?.street); // "123 Main St"
console.log(user?.contact?.email);  // undefined

// Bitwise Operators
console.log(5 & 3);      // Bitwise AND: 1
console.log(5 | 3);      // Bitwise OR: 7
console.log(5 ^ 3);      // Bitwise XOR: 6
console.log(~5);         // Bitwise NOT: -6
console.log(5 << 1);     // Left shift: 10
console.log(5 >> 1);     // Right shift: 2
console.log(5 >>> 1);    // Unsigned right shift: 2

// String Operators
let str1 = "Hello";
let str2 = "World";
console.log(str1 + " " + str2); // Concatenation: "Hello World"
let greeting = "Hello";
greeting += " World";    // Concatenation assignment

// Type Operators
console.log(typeof "Hello");     // "string"
console.log(typeof 123);         // "number"
console.log(typeof true);        // "boolean"
console.log(obj instanceof Object); // Check if object is instance of a class

let person = {
    name: "Alice",
    age: 30,
    sayHello: function() {
        console.log("Hello, my name is " + this.name);
    }
};

// Accessing object properties
console.log(person.name); // Alice
console.log(person["age"]); // 30

// Calling object methods
person.sayHello(); // Hello, my name is Alice

// Adding a new property
person.job = "Developer";

// Object destructuring (ES6+)
let { name, age } = person;
console.log(name, age); // Alice 30

// Function declaration
function greet(name) {
    return "Hello, " + name + "!";
}

// Function expression
const multiply = function(a, b) {
    return a * b;
};

// Arrow function (ES6+)
const add = (a, b) => a + b;

// Default parameters (ES6+)
function power(base, exponent = 2) {
    return Math.pow(base, exponent);
}

console.log(greet("Alice")); // Hello, Alice!
console.log(multiply(3, 4)); // 12
console.log(add(5, 3)); // 8
console.log(power(3)); // 9
console.log(power(2, 3)); // 8

let fruits = ["apple", "banana", "orange"];

// Accessing array elements
console.log(fruits[0]); // apple

// Array methods
fruits.push("grape"); // Add to the end
fruits.unshift("mango"); // Add to the beginning
let lastFruit = fruits.pop(); // Remove from the end
let firstFruit = fruits.shift(); // Remove from the beginning

// Iterating over arrays
fruits.forEach(fruit => console.log(fruit));

// Array transformation
let upperFruits = fruits.map(fruit => fruit.toUpperCase());

// Filtering arrays
let longFruits = fruits.filter(fruit => fruit.length > 5);

// Reducing arrays
let totalLength = fruits.reduce((sum, fruit) => sum + fruit.length, 0);

// Spread operator (ES6+)
let moreFruits = ["kiwi", "pear"];
let allFruits = [...fruits, ...moreFruits];

let age = 18;

// if...else statement
if (age >= 18) {
    console.log("You are an adult");
} else {
    console.log("You are a minor");
}

// Ternary operator
let status = age >= 18 ? "adult" : "minor";

// switch statement
switch (age) {
    case 13:
        console.log("You're a teenager");
        break;
    case 18:
        console.log("You're now an adult");
        break;
    default:
        console.log("You're neither 13 nor 18");
}

// for loop
for (let i = 0; i < 5; i++) {
    console.log(i);
}

// while loop
let count = 0;
while (count < 5) {
    console.log(count);
    count++;
}

// do...while loop
let x = 0;
do {
    console.log(x);
    x++;
} while (x < 5);

// for...of loop (ES6+)
let numbers = [1, 2, 3, 4, 5];
for (let num of numbers) {
    console.log(num);
}

// for...in loop (for object properties)
let person = { name: "Alice", age: 30 };
for (let key in person) {
    console.log(key + ": " + person[key]);
}

try {
    // Code that might throw an error
    throw new Error("Something went wrong");
} catch (error) {
    console.error("Caught an error:", error.message);
} finally {
    console.log("This always runs");
}

// Custom error
class CustomError extends Error {
    constructor(message) {
        super(message);
        this.name = "CustomError";
    }
}

try {
    throw new CustomError("A custom error occurred");
} catch (error) {
    if (error instanceof CustomError) {
        console.log("Caught a custom error:", error.message);
    } else {
        console.log("Caught a different error:", error.message);
    }
}

// Template literals
let name = "Alice";
console.log(`Hello, ${name}!`);

// Destructuring
let [a, b] = [1, 2];
let { x, y } = { x: 3, y: 4 };

// Default parameters
function greet(name = "Guest") {
    console.log(`Hello, ${name}!`);
}

// Rest parameters
function sum(...numbers) {
    return numbers.reduce((total, num) => total + num, 0);
}

// Spread operator
let arr1 = [1, 2, 3];
let arr2 = [...arr1, 4, 5];

// Arrow functions
const square = x => x * x;

// Classes
class Animal {
    constructor(name) {
        this.name = name;
    }
    speak() {
        console.log(`${this.name} makes a sound.`);
    }
}

// Promises
const fetchData = () => {
    return new Promise((resolve, reject) => {
        // Asynchronous operation
        setTimeout(() => resolve("Data fetched"), 1000);
    });
};

// Async/Await
async function getData() {
    try {
        const data = await fetchData();
        console.log(data);
    } catch (error) {
        console.error(error);
    }
}

// Selecting elements
const element = document.getElementById("myElement");
const elements = document.getElementsByClassName("myClass");
const queryElement = document.querySelector(".myClass");
const queryElements = document.querySelectorAll(".myClass");

// Modifying elements
element.textContent = "New text content";
element.innerHTML = "<strong>New HTML content</strong>";
element.style.color = "red";
element.classList.add("newClass");
element.classList.remove("oldClass");

// Creating and appending elements
const newElement = document.createElement("div");
newElement.textContent = "New element";
document.body.appendChild(newElement);

// Removing elements
element.parentNode.removeChild(element);
// or
element.remove(); // Modern browsers

const button = document.querySelector("#myButton");

// Adding event listeners
button.addEventListener("click", function(event) {
    console.log("Button clicked!");
    console.log("Event object:", event);
});

// Removing event listeners
function handleClick(event) {
    console.log("Button clicked!");
}
button.addEventListener("click", handleClick);
button.removeEventListener("click", handleClick);

// Event delegation
document.body.addEventListener("click", function(event) {
    if (event.target.matches("#myButton")) {
        console.log("Button clicked using event delegation!");
    }
});

// Preventing default behavior
const link = document.querySelector("a");
link.addEventListener("click", function(event) {
    event.preventDefault();
    console.log("Link click prevented");
});

// Callbacks
function fetchData(callback) {
    setTimeout(() => {
        callback("Data fetched");
    }, 1000);
}

fetchData(data => console.log(data));

// Promises
function fetchDataPromise() {
    return new Promise((resolve, reject) => {
        setTimeout(() => {
            resolve("Data fetched");
        }, 1000);
    });
}

fetchDataPromise()
    .then(data => console.log(data))
    .catch(error => console.error(error));

// Async/Await
async function fetchDataAsync() {
    try {
        const data = await fetchDataPromise();
        console.log(data);
    } catch (error) {
        console.error(error);
    }
}

fetchDataAsync();

// Fetch API
fetch('https://api.example.com/data')
    .then(response => response.json())
    .then(data => console.log(data))
    .catch(error => console.error('Error:', error));

// math.js
export function add(a, b) {
    return a + b;
}

export function multiply(a, b) {
    return a * b;
}

// main.js
import { add, multiply } from './math.js';

console.log(add(5, 3)); // 8
console.log(multiply(4, 2)); // 8

// Default export
// utils.js
export default function sayHello(name) {
    console.log(`Hello, ${name}!`);
}

// main.js
import sayHello from './utils.js';

sayHello("Alice"); // Hello, Alice!