// // ✅ Arithmetic Operators

// let a = 5;
// let b = 4;

// console.log("a =", a, "& b =", b);

// console.log("a + b =", a + b);
// console.log("a - b =", a - b);
// console.log("a * b =", a * b);
// console.log("a / b =", a / b);
// console.log("a % b =", a % b);
// console.log("a ** b =", a ** b);

// // ✅ Unary Operators (Prefix Decrement Example)

// a = 5;
// b = 4;
// console.log("--b =", --b);
// console.log("b =", b);

// // ✅ Assignment Operators (Exponent Assignment)

// a = 5;
// a **= a;
// console.log("a =", a);

// // ✅ Comparison Operators
// a = 5;
// b = 6;
// console.log("a <= b =", a <= b);

// // ✅ Logical Operators (NOT operator example)

// console.log("!(6 < 5) =", !(6 < 5));

// // ✅ Conditional Statements (if / else if / else)

// let age = 19;
// if (age >= 18)
// console.log("you can vote");
// else if (age < 18)
// console.log("you cannot vote");
// else
// console.log("not eligible to vote");

// // ✅ Ternary Operator
// age = 17;
// let result = (age >= 18) ? "you can vote" : "you cannot vote";
// console.log(result);

// // ✅ Modulo Check (Check Multiple of 3)

// let num = 9;
// if (num % 3 == 0) {
// console.log("this is multiple of 3");
// } else {
// console.log("this is not multiple of 3");
// }

// // ✅ For Loop
// for (let count = 2; count <= 12; count++) {
// console.log("Anees");
// }

// // ✅ While Loop
// let i = 1;
// while (i <= 10) {
// console.log("Anees");
// i++;
// }

// // ✅ Do-While Loop
// i = 10;
// do {
// console.log("i =", i);
// i++;
// } while (i <= 5);

// // ✅ For-Of Loop on String

// let str = "Aneeskhan";
// for (let ch of str) {
// console.log("i =", ch);
// }

// // ✅ Loop to Print Odd Numbers from 0 to 100

// for (let num = 0; num <= 100; num++) {
// if (num % 2 !== 0) {
// console.log("num =", num);
// }
// }

// // ✅ Template Literals (String Interpolation)

// let obj = {
// item: "pen",
// price: 10
// };
// let output = `the price of a ${obj.item} is ${obj.price} rupees`;
// console.log(output);

// // ✅ String Methods - toUpperCase

// str = "anees khan jab be karta hi";
// str = str.toUpperCase();
// console.log(str);

// // ✅ String Methods - toLowerCase

// str = "anees khan jab be karta hi";
// str = str.toLowerCase();
// console.log(str);

// // ✅ String Methods - trim + toUpperCase

// str = " anees is big boy ";
// str = str.toUpperCase();
// str = str.trim();
// console.log(str);

// // ✅ String Methods - slice

// str = 'aneesahmedshad';
// str = str.slice(1, 9);
// console.log(str);

// // ✅ String Concatenation
// let str1 = "anees alka";
// let str2 = "anees malojka";
// console.log(str1 + str2);
// // ✅ String replace Method
// str = "aneeskhan is pi";
// str = str.replace("pi", "student");
// console.log(str);

// // ✅ String charAt Method

// str = "ilovejs";
// console.log(str.charAt(4));

// // ✅ String Concatenation with Symbols & Numbers

// str1 = "@";
// str2 = "aneesahmed";
// let str3 = "1221";
// console.log(str1 + str2 + str3);

// // ✅ Arrays - Declaration and Printing

// let marks = [97, 50, 70, 56, 12];
// console.log(marks);

// // ✅ Arrays - Loop through Array using for-of

// let heroes = ["hulk", "gambet", "ironman", "ali", "alyar"];
// for (let hero of heroes) {
// console.log(hero);
// }

// // ✅ Array Loop - Convert Cities to Uppercase

// let cities = ["kohat", "islmabad", "lahore", "karachi", "pesahawr"];
// for (let city of cities) {
// console.log(city.toUpperCase());
// }

// // ✅ Array - Calculate Average from Marks

// marks = [45, 57, 90, 78, 77, 45, 67, 89, 98, 70];

// let sum = 0;
// for (let val of marks) {
// sum += val;
// }

// let avg = sum / marks.length;

// console.log(`the value of avg is =${avg}`);
// let veggies=["palak","paneer","pista","papaaya"];
// veggies.push("papiata","palom");
// console.log(veggies);
// let villian=["thanos","darksied","joker","black adam","magneto"];
// let hero=["batman,ironman","henrycavil","thor","hulk"];

// let cinema=villian.concat(hero);
// console.log(cinema);
// let marks = [14, 14, 51, 41, 61, 71, 81, 91];
// marks.splice(4, 2, 41, 90, 80);
// console.log(marks);
// function anees() {
// console.log("anees is a programmer");
// console.log("he is hating JS");
// }

// anees();
// const arrowfunction = (a, b) => {
// return a + b;
// }
// const arrowfunction1 = (a, b) => {
// return a * b;
// }
// function countvowels(str) {
// let count = 0;
// for (let char of str) {
// if (
// char === "a" ||
// char === "e" ||
// char === "i" ||
// char === "o" ||
// char === "u"
// ) {
// count++;
// }
// }
// return count;
// }
// let arr= [6,7,8,9,10]
// arr.forEach((val,idx,arr) => {
// console.log(val,idx,arr);
// });
// let nums = [40, 10, 30];
// let newarr = nums.map((val) => {
// return val * val * val * val * val;
// });
// console.log(newarr);
// let arr=[1, 2, 3, ... 100]
// let newarr=arr.filter( (val) => {
// return val % 2 === 0;

// })
// console.log(newarr)

// // let headers= document.getElementsByClassName("header");

// // console.dir(headers);
// // console.log(headers);
// let elements = document.querySelectorAll("p");
// console.dir(elements);
// console.log(elements);
// let div = document.querySelector("box");
// console.log(div.getAttribute("box"));
// let div = document.getElementById("box");
// div.style.backgroundColor = "red";
let newbtn = document.createElement("button"); // create a new button element
newbtn.innerText = "click it"; // set button text
console.log(newbtn);

let div = document.querySelector("div"); // select existing div

div.append(newbtn); // append the button into the div

// ---------------------
1️⃣ 1 Callback Hell
1//
// ---------------------
function taskOneCallback(callback) {
setTimeout(() => {
console.log("Task 1 completed (callback)");
callback();
}, 1000);
}

function taskTwoCallback(callback) {
setTimeout(() => {
console.log("Task 2 completed (callback)");
callback();
}, 1000);
}

function taskThreeCallback(callback) {
setTimeout(() => {
console.log("Task 3 completed (callback)");
callback();
}, 1000);
}

taskOneCallback(() => {
taskTwoCallback(() => {
taskThreeCallback(() => {
console.log("All tasks completed! (Callback Hell)\n");
});
});
});

// ---------------------
2️⃣
// Promises with .then()
// ---------------------
function taskOne() {
return new Promise((resolve) => {
setTimeout(() => {
console.log("Task 1 completed (promise)");
resolve();
}, 1000);
});
}

function taskTwo() {
return new Promise((resolve) => {
setTimeout(() => {
console.log("Task 2 completed (promise)");
resolve();
}, 1000);
});
}

function taskThree() {
return new Promise((resolve) => {
setTimeout(() => {
console.log("Task 3 completed (promise)");
resolve();
}, 1000);
});
}

taskOne()
.then(() => taskTwo())
.then(() => taskThree())
.then(() => {
console.log("All tasks completed using Promises!\n");
});

// ---------------------
3️⃣
// Async/Await Version
// ---------------------
async function runTasks() {
await taskOne();
await taskTwo();
await taskThree();
console.log("All tasks completed using async/await!");
}

runTasks();