JAVASCRIPT

async javascript

(async () => {
  let response = await fetch('/article/promise-chaining/user.json');
  let user = await response.json();
  ...
})();

// (BONUS CODE) await with promise
await new Promise(resolve => setTimeout(resolve, 1000))
console.log('Hello!') // 1 seconds after sended console.log

javascript async script

<script async src="script.js"></script>

async await

// example using promise
const user = () => {
	fetch("https://randomuser.me/api/?results=1")
    .then((data) => {
         console.log(data); // here you recive data
    }).catch((err)=>{
         console.log(err); // here error
    });
}

// example using async/await

const user = async () => {
  	// you must have use async keyword before use await
	const data = await fetch("https://randomuser.me/api/?results=1");
  	console.log(data); // if error occured it will be null or empty
}

async function

const foo = async () => {
   await// do something
}
// OR
async function foo() {
  await// do something
}

Define an async function

const yourAsyncFunction = async () => {
    // do something asynchronously and return a promise
    return result;
  }
  
anArray.forEach(async item => {
   // do something asynchronously for each item in 'anArray'
   // one could also use .map here to return an array of promises to use with 'Promise.all()'
 });
 
server.getPeople().then(async people => {
  people.forEach(person => {
    // do something asynchronously for each person
  });
});

async await in javascript

 const showPosts = async () => {
 const response = await fetch('https://jsonplaceholder.typicode.com/posts');
 const posts = await response.json();
 console.log(posts);
}

showPosts();

javascript async/await

//ORIGINAL
//each .then() returns a promisse and can be chained. The .then() will run after the previous one has finished. It emulates an async/await behavior.

fetch('https://jsonplaceholder.typicode.com/users')//fetch the content
  .then((response) => response.json())//then use that content and convert it to a javascript object
  .then(users => {
    const firstUser = users[0];
    console.log(firstUser);
    return fetch('https://jsonplaceholder.typicode.com/posts?userId=' + firstUser.id);
  })//then return the content from posts related to that user ID
  .then((response) => response.json())//then use that content and convert it to a javascript object
  .then(posts => console.log(posts));//then log the result


//ASYNC/AWAIT
const myAsyncFunction = async () => {//define that this will be asynchronous
  const usersResponse = await fetch('https://jsonplaceholder.typicode.com/users');//wait for the fecth result and put it in the variable
  const users = await usersResponse.json();//wait for the previous item to be done, transform it into a javascript object and put it in the variable
  const secondUser = users[1];

  console.log(secondUser);//then log the result

  const postsResponse = await fetch('https://jsonplaceholder.typicode.com/posts?userId=' + secondUser.id);//wait for the previous item to be done, wait for the fecth result and put it in the variable
  const posts = await postsResponse.json();//wait for the previous item to be done, transform it into a javascript object and put it in the variable

  console.log(posts);//then log the result
}

myAsyncFunction();

what is an async function

// Old School Javascript Invoke
(async function() {
	await someAsyncFunction();
})();

//New ES6 Javascript Invoke
(async () => {
	await someAsyncFunction();
})();

//Example (async & await)
function delayResult() {
 return new Promise(resolve => {
   setTimeout(() => {
     resolve(‘Done’);
   }, 5000)
 })
}
async function getResult() {
 let result = await delayResult();
 return result;
}
getResult();

//New Example 
const data = async ()  => {
  const got = await fetch('https://jsonplaceholder.typicode.com/todos/1');
  
  console.log(await got.json())
}

data();

async await

//used in node.js
const fetch = require('node-fetch');
async function Showuser() {
  const result = await fetch('https://jsonplaceholder.typicode.com/todos/1');
  const date = await result.json();
  console.log(date);
}

Showuser();

async await

// ASYNC will always returns promises
// NOTE : AWAIT should be kept only inside ASYNC function
// AWAIT can't be used in regular function
/* TIPS : Js is single threaded & synchronous in nature BUT, we can
          make it as asyncronous by using (ASYNC/AWAIT)*/

//(Example 1 : fetching Random Image)
async function RandomImage(){  //remember async and await is powerful for async operations, always await should be inside of async only.

  try {
    const raw_response = await fetch("https://www.themealdb.com/api/json/v1/1/random.php");
      if (!raw_response.ok) { // check for the 404 errors
          throw new Error(raw_response.status);
      }
    const json_data = await raw_response.json();  //AWAIT
    let data = json_data.meals[0];

    console.log(data);
  }
  catch (error) { // catch block for network errors
      console.log(error); 
  }
}
RandomImage();


//(Example 2 : returning another promise)
console.log("1 is working");
console.log("2 is working");
  var AsyncFunction = async() => {
    var x = new Promise((resolve,reject) => {
        setTimeout(() => resolve("3 is working"), 3000);
    });
    var result = await x;
    return result;
  }
AsyncFunction().then(resolved => console.log(resolved));
console.log("3 is working");

Create Async method

// simple method structure
public static  Task<int> FooAsync(int num)
{
   num+=5;
   return Task.FromResult(num);
}
// calling function structure
public static async void Solve()
{
    var temp = await FooAsync(i);
}

async await

async function showAvatar() {
	// read
  	await setTimeout(resolve, 3000);
    // read next 3s
}

showAvatar();

script async syntax

<script src="demo_async.js" async></script>

async await

async function f() {

  try {
    let response = await fetch('/no-user-here');
    let user = await response.json();
  } catch(err) {
    // catches errors both in fetch and response.json
    alert(err);
  }
}

f();

async function javascript dec

  const mapUrl = 'https://';

(async (getUrl) => {
   const response = await fetch(mapUrl);
    const data = await response.json();
    console.log(data);
})();

async await

async function () {
  const fetchAPI = fetch(`https://bn-hadith-api.herokuapp.com/hadiths/0`);
  const response = await fetchAPI;
  const data = await response.json();
  console.log(data);
}

async function javascript

//Async function (JAVASCRIPT)
//async function have 1 main purpose:

//Being able to use 'await' in a function
function example() {
return await fetch('https://mysite.com/api'); //error
}

async function smartexample() {
return await fetch('https://mysite.com/api'); //mhmm!
}

example of async and await in javascript

// example of async and await in javascript
// First create promise
let myPromise = () => {
  return new Promise((resolve, reject) => {
    setTimeout(() => {
      resolve('Yay, I resolved!')
    }, 1000);
  });
}

// async without await keyword
async function noAwait() {
 let value = myPromise();
 console.log(value);
}
 
// async with await keyword
async function yesAwait() {
 let value = await myPromise();
 console.log(value);
}
 
noAwait(); // Prints: Promise { <pending> }
yesAwait(); // Prints: Yay, I resolved!

javascipt async

const asyncExample = async () => {};

JavaScript Async

function myFunction() {
  return Promise.resolve("Hello");
}

async await

async function abc() {
    console.log("1");
    const response = await fetch("https://jsonplaceholder.typicode.com/users");
    console.log("4");
    const users = await response.json();
    console.log("5");
    return users;
  }
  
  const a = abc();
  
  a.then((e) => {
    console.log(e);
  });
  console.log("2");
  console.log(a);
  console.log("3");

async await js

fetch('coffee.jpg')
.then(response => {
  if (!response.ok) {
    throw new Error(`HTTP error! status: ${response.status}`);
  } else {
    return response.blob();
  }
})
.then(myBlob => {
  let objectURL = URL.createObjectURL(myBlob);
  let image = document.createElement('img');
  image.src = objectURL;
  document.body.appendChild(image);
})
.catch(e => {
  console.log('There has been a problem with your fetch operation: ' + e.message);
});

await async

function afterPrintSave() {
    Xrm.Page.data.save().then(
        function () {
            resolve();
        },
        function (err) {
            resolve(alert(err.message));
        }
    );
}

Javscript Async Function

// async function example

async function f() {
    console.log('Async function.');
    return Promise.resolve(1);
}

f();