bang await chaining operator

💡 Ideas
1 
// this is verbose
const response  = await fetch('/posts')
const posts = await response.json()

// chaining multiple await expressions in one line is awkward
const posts = await (await fetch('/posts')).json()

// proposal: chain together multiple awaits with !.
const posts = await fetch('/posts')!.json()
2 Likes
2

This has been dubbed the wavy dot

await fetch('/posts')~.json();
4 Likes
3

Awesome, glad this idea already has some notoriety.

1 Like
4

The arrow proposal seems nicer, in chaining commonly there are dot and arrow: Async property accessor: ->

5

I’ve just decided in the mean time, while async chaining does not exist, to use just intermediate variables. The double await just looks bad to me.

1 Like
6

I personally like to just use the .then() method instead of a double-await.

const someResource = fetch('something')
  .then(response => response.json())
7

As I explained in Async property accessor: -> - #5 by mhofman, wavy dot is meant to enable avoiding intermediary await, allowing to pipeline the operations when they are performed on a remote system.

If operations execute in a single JS agent, then there is no difference with explicit awaiting, and the eventual-send effectively does that since the promise is decided locally.

The pipeline operator may help tidying the nested aspect without a new dedicated operator:

const posts = await fetch('/posts') |> await %.json();
8

That sounds a bit more advanced than an everyday use case.

I think my opinion on this API has changed a little. The main place I wanted it was on the fetch API, but since fetch doesn't fail when the request fails, I prefer to just handle the response.

const response = await fetch('/get')

if (!response.ok) throw new Error('Request failed')

const data = await response.json()
1 Like