htmlinsertion.js

// first.insertAdjacentHTML('beforeend', '<div class = "test">beforeend</div>');
// first.insertAdjacentHTML('afterend', '<div class = "test">afterend</div>');

// NODE REMOVAL
// first.remove()  

// first.className = "text-black red"

// // REMOVING A CLASS

// first.classList.remove("red")

// console.log(first.classList)

// // ADDING A CLASS

// first.classList.add("red")

// console.log(first.classList)

// // ADD OR REMOVE 

// first.classList.toggle("red")

// // TO CHECK FOR THE GIVEN CLASS 

// console.log(first.classList.contains("red"))
// console.log(first.classList.contains("text-black"))

// // SETTIMEOUT AND SETINTERVAL

// // alert("hello")

// let a = setTimeout(function() {
//     alert("I am inside of setTimeout")
// }, 2000)

// // console.log(a)

//  let b = prompt("do you want to run the setTimeout")
//  if ("no" == b) {
//      clearTimeout(a)
//  }


// clearTimeout(a) 

// const sum =  (a, b) => {
//     console.log("yes I am rnning" + (a + b))
//     a + b
// }

//  setTimeout(sum, 4000, 1, 2)

// console.log(sum)

// let k = setInterval(function() {
//          alert("I am inside of setInterval")
//      }, 2000)

//      clearInterval(k)

// INTRODUCTION TO BROWSER EVENTS

// let a = document.getElementsByClassName("container")[0]

//  a.onclick= ()=>{
//      let b = document.getElementsByClassName("container")[0]
//      b.innerHTML = "Hello World"
//  } 

//    EVENT LISTENER

//  let x = function(e) {
//     alert("Hello World1")
//  }

//  let y = function(e) {
//     alert("Hello World2")
//  }

//  btn.addEventListener('click', x)

//  btn.addEventListener('click', y)

//  let a = prompt("What is your favourite number?")

//  if (a == "2") {
//     btn.removeEventListener('click', y)
//  }

// let x = function (e) {
//   // alert("Hello World1")
//   console.log(e.clientX, e.clientY, e.clientZ)
// }

// let y = function (e) {
//   //   alert("Hello World2")
//   console.log(e)
// }

// btn.addEventListener('click', x)

// btn.addEventListener('click', y)

// // let a = prompt("What is your favourite number?")

// // if (a == "2") {
// //   btn.removeEventListener('click', x)
// // }
// // console.log("Start")
// // setTimeout(function() {
// //   console.log("Hey I am good");
// // }, 3000)       
// // console.log("End")

// // CALLBACK FUNCTIONS

// function loadScript(src, callback) {
//   var script = document.createElement('script');
//   script.src = src;

//   script.onload = function () {
//     console.log("I am appended successfully")
//     callback();
//   }
//   script.onerror = function () {
//     alert("Sorry your script can not be loaded")
//   }
//   document.body.appendChild(script);
// }
// function hello() {
//   alert("Hello World")
// }

// setTimeout(function (lakka) {
//   alert("Mai Nameer lakka hu")
// }, 8000)
// function greeting() {
//   alert("Good Morning")
// }

// loadScript("https://cdn.jsdelivr.net/npm/bootstrap@5.3.5/dist/js/bootstrap.bundle.min.js", hello(), lakka())

// setTimeout(function () {
//   alert("I am inside of setTimeout")
// }, 2000)

// let p = new Promise((resolve, reject) => {
//     console.log("promise is pending")
//     setTimeout(() => {
//         console.log("I am promise and I am rejected")
//         // resolve(true)
//         reject(new Error("I am an error"))

//     }, 5000)
// })

// console.log(p)
// let p = new Promise((resolve, reject) => {
//     console.log("promise is pending")
//     setTimeout(() => {
//         console.log("I am promise and I am fulfilled")
//         resolve(true)
//         // reject(new Error("I am an error"))

//     }, 5000)
// }) 

// console.log(p)

// p.then((value)=>{
//     console.log(value)
// })
// let p1 = new Promise((resolve, reject)=>{
//     setTimeout(()=>{
//         console.log("Resolved after 2 sconds")
//         // resolve(56)
//         reject(new Error("It's an error"))
//     }, 2000)
// })

// console.log(p1)
// p1.then((value)=>{
//     console.log(value)
// })

// p1.catch((error)=>{
//     console.log(error)
// })

// PROMISE CHAINING

//  let p1 = new Promise((rseolve, reject)=>{
//    setTimeout(()=>{
//    console.log("Resolved after 2 seconds")
//       rseolve(56)
//    }, 2000)
//  })
//  p1.then((value)=>{
//     console.log(value)
//     let p2 = new Promise((rseolve, reject)=>{
//         rseolve("Promise 2")
//     })
//    return p2
// })

// .then((value)=>{
//     console.log("We are done")
//     console.log(value)
//     let p3 = new Promise((resolve, reject)=>{
//         resolve("Now we are pakka done")

//     }) 
//     return 2
//     return p3 
// }).then((value)=>{
//     console.log(value)
// }) 

// }).then((value)=>{
//     console.log(value)
// })

// ATTACHING MULTIPLE HANDLERS TO A PROMISE

// let p1 = new Promise((resolve, reject)=>{

//     setTimeout(()=>{
//         console.log("Hey I am resolved")
//         resolve(1)
//     }, 2000)
// })

// p1.then((value)=>{
//     console.log(value)
//     return new Promise((resolve, reject)=>{
//      setTimeout(()=>{
//         resolve(4)
//      }, 3000)
//     }).then((value)=>{
//         console.log("this is resolved")
//         console.log(value)
//         console.log("congratulations this promise is now resolved")
//     })

// })

// p1.then(()=>{
//     console.log("Hurray")
// })


// PROMISE API

// p1 = new Promise((resolve, reject) => {
//     setTimeout(() => {
//         resolve(786)
//     }, 2000)
// })

// p2 = new Promise((resolve, reject) => {
//     setTimeout(() => {
//         resolve(7)
//     }, 3000)
// })

// p3 = new Promise((resolve, reject) => {
//     setTimeout(() => {
//         resolve(3)
//     }, 4000)
// })

// p1.then((value)=>{
//     console.log(value)
// })

// p2.then((value)=>{
//     console.log(value)
// })

// p3.then((value)=>{
//     console.log(value)
// })
// let promise_all = Promise.all([p1, p2, p3])
// promise_all.then((value) => {
//     console.log(value)
// })

// ASSYNC/AWAIT

// async function lakka() {
//     let delhiweather = new Promise((resolve, reject)=>{
//     setTimeout(()=>{
//         resolve("27 degrees")
//     }, 3000)
// })

// let bangloreweather = new Promise((resolve, reject)=>{
//     setTimeout(()=>{
//         resolve("21 degrees")
//     }, 6000)
// })


// delhiweather.then((value)=>{
//     alert("weather of delhi is" + value)
// })

// bangloreweather.then((value)=>{
//     alert("weather of banglore is" + value)
// })

// OR

// delhiweather.then(alert)
// bangloreweather.then(alert)

// console.log("Fetching Delhi weather please wait....")
// let delhiw = await delhiweather
// console.log("Delhi's weather has been fetched successfully" + delhiw)
// console.log("Fetching Banglore weather please wait....")
// let banglorew = await bangloreweather
// console.log("Banglore's weather has been fetched successfully" + banglorew)
// return [delhiw, banglorew]



// let delhiw = await delhiweather
// let banglorew = await bangloreweather
// return [delhiw, banglorew]

// console.log(delhiw)
// console.log(banglorew)
// }

// console.log(lakka()) 

// const staralien = () => {
//     console.log("Hey I am staralien nd I am not waiting")
// }

// let a = lakka()
// let b = staralien()
// a.then((value)=>{
//     console.log(value)


// })

// FINALLY CLAUSE

// try{
//     let a =0
//     console.log(p)
//     console.log("program ran succesfully")
// }

// catch(error) {
//     console.log(o)
//     console.log("this is an error")
// }


// finally {
//     console.log("I am a good boy yay!")
// }  

// async function lakka() {

//     let p1 = new Promise((resolve, reject) => {
//         // console.log("this is your javascript file")

// setTimeout(() => {
//             resolve("hello")
//         }, 3000)

//     })




//   p1.then((value) => {
//         console.log(value)
//     })

//  let p1a = await p1

// console.log(p1a)
// }

// try {
//     console.log("No Error")
//     console.log(error)
// }

// catch (error){
//     console.log(kfewofjsfjeo)
//     console.log("abey chutiye error aa gya")
// }

// finally {
//     console.log("Isko try kar chutiye")
// }

// async function fetchingData () {
// try{
//  let lmao = await fetch('https://jsonplaceholder.typicode.com/posts')
// let data = lmao.json
// console.log(lmao)
// console.log("after fetching")
// } catch (error) {
// console.error("Error fetching Data....")
// }}
// fetchingData()

// async function annu() {

//     let a = new Promise((resolve, reject) => {



//         setTimeout(() => {
//             resolve(456)
//         }, 5000)


//     })

//     a.then((value) => {
//         console.log(value)
//     })

//     const b = console.log("Hey I am under async function")

//     let b1a = await b
//     console.log(b1a)
// }


// annu()
// a.then((value)=>{
//     console.log(value)
// })


async function demo() {

console.log("Demo has been started")
let p = await new Promise((resolve, reject) => {
    setTimeout(() => {
        resolve(786)
        console.log("Timeout has finished")
        
    }, 3000) 
})

// let c = await p
// console.log(c)


console.log("The demo has been finished")
}

demo()

// SOLUTION FROM CHAT GPT

// let p = new Promise((resolve, reject) => {


//  setTimeout(() => {
//     resolve(786)
//          console.log("Timeout has finished")
//      }, 4000) 
 
//  })
//  p.then((value) =>{
//     console.log(value)
//  })

// async function example() {
//   console.log("start")
  
//   await new Promise (resolve => {
//     setTimeout(()=>{
//         console.log("Timeout finished")
//         resolve()
//     }, 2000)
//   })
//   console.log("end")
// }
// example()