Preview:
<!DOCTYPE html> 
<html lang="en"> 
<head> 
  <meta charset="UTF-8"> 
  <meta name="viewport" content="width=device-width, initial-scale=1.0"> 
  <title>JavaScript Callbacks, Promises, Async/Await</title> 
</head> 
<body> 
  <h1>JavaScript Callbacks, Promises, and Async/Await Demo</h1> 
  <script> 
    // Callback Example 
    function doSomething(callback) { 
      setTimeout(() => { 
        callback("Callback done!"); 
      }, 1000); 
    } 
    doSomething(console.log); 
 
    // Promise Example 
    let promise = new Promise((resolve, reject) => { 
      setTimeout(() => resolve("Promise resolved!"), 1000); 
    }); 
    promise.then(console.log); 
 
    // Async/Await Example 
    async function asyncFunction() { 
      let result = await promise; 
      console.log(result); 
    } 
    asyncFunction(); 
  </script> 
</body> 
</html>
downloadDownload PNG downloadDownload JPEG downloadDownload SVG

Tip: You can change the style, width & colours of the snippet with the inspect tool before clicking Download!

Click to optimize width for Twitter