Callbacks

https://www.youtube.com/watch?v=PoRJizFvM7s&t=1s


Callbacks

const posts = [
  { title: 'Post One', body: 'This is post one' },
  { title: 'Post Two', body: 'This is post two' },
];

function getPosts() {
  setTimeout(() => {
    let output = '';
    posts.forEach((post, index) => {
      output += `<li>${post.title}</li>`;
    });

    document.body.innerHTML = output;
  }, 1000);
}

function createPost(post, callback) {
  setTimeout(() => {
    post.push(post);
    callback();
  }, 2000);
}

getPosts();

createPost({ title: 'Post Three', body: 'This is post three' }, getPosts);


Promises

const posts = [
  { title: 'Post One', body: 'This is post one' },
  { title: 'Post Two', body: 'This is post two' },
];

function getPosts() {
  setTimeout(() => {
    let output = '';
    posts.forEach((post, index) => {
      output += `<li>${post.title}</li>`;
    });

    document.body.innerHTML = output;
  }, 1000);
}

function createPost(post) {
  return new Promise((resolve, reject) => {
    setTimeout(() => {
      post.push(post);

      const error = false;

      if (!error) {
        resolve();
      } else {
        reject('Error: Something went wrong');
      }
    }, 2000);
  });
}

// createPost({ title: 'Post Three', body: 'This is post three'})
//     then(getPosts)
//     catch(err => console.log(err));

const promise1 = new Promise.resolve('Hello World');
const promise2 = 10;
const promise3 = new Promise.resolve((resolve, reject) => {
  setTimeout(resolve, 2000, 'Goodbye');
});

const promise4 = fetch(
  'https://jsonplaceholder.typicode.com/users'
).then((res) => res.json());

promise
  .all([promise1, promise2, promise3, promise4])
  .then((values) => console.log(values));


Async - Await

const posts = [
  { title: 'Post One', body: 'This is post one' },
  { title: 'Post Two', body: 'This is post two' },
];

function getPosts() {
  setTimeout(() => {
    let output = '';
    posts.forEach((post, index) => {
      output += `<li>${post.title}</li>`;
    });

    document.body.innerHTML = output;
  }, 1000);
}

function createPost(post) {
  return new Promise((resolve, reject) => {
    setTimeout(() => {
      post.push(post);

      const error = false;

      if (!error) {
        resolve();
      } else {
        reject('Error: Something went wrong');
      }
    }, 2000);
  });
}

// async function init(){
//     await createPost({ title: 'Post Three', body: 'This is post three' });
//
//     getPosts();
// }
//
// init();

async function fetchUsers() {
  const res = await fetch('https://jsonplaceholder.typicode.com/users');

  const data = await res.json();

  console.log(data);
}

fetchUsers();