quartz/content/notes/06-async-javascript.md

---
title: "06-async-javascript"
aliases: 
tags: 
- lecture
- cosc203
---

Async programming allows you to start a potentially long running task have still be able to interact while it it running

# general process
- start the task
- return immediately so other tasks can run
- notify us with result when the task is finished


# promises
- an object returned by an async function
- represents the current state of the operation
- when the promise is returned to the caller it not always finished
- the promise object has methods to handle the eventual success or failure of the operation

``` javascript
const fetchPromise = fetch('https://url.url.json')

fetchPromise
	.then((reponse) => {
		return response.json();
	})
	.then((data) => {
		console.log(data[0].name)
	})
```

each `.then` itself returns another promise which also has a `.then` method. This is called **promise chaining**


## promise statuses

**pending:** the promise is created but the task has not finished yet
**fulfilled:** the task has finished successfully -> `then()` is called
**rejected:** the task has failed -> `catch()` is called
**settled:** fulfilled or rejected

## combining promises

```javascript
Promise.all([fetchPromsise1, fetchPromsise2, fetchPromsise3]) //all promises need to be fulfilled but they dont depend of each other
Promise.any([fetchPromsise1, fetchPromsise2, fetchPromsise3]) //any 
```

# error handling
the fetch API can throw errors

to handle these promise objects have a `catch` method. this is similar to a `.then` but only trigger when there is an error.

``` javascript
const fetchPromise = fetch('https://url.url.json')

fetchPromise
	.then((reponse) => {
		return response.json();
	})
	.then((data) => {
		console.log(data[0].name)
	})
	.catch((error) => {
		console.error('could not get products: ${error}')
	})
```