React Native Meets Async Functions
It's a great joy reading from the people who run the most advanced tools in React Native, and the framework itself.
James Ide of React Native and Exponent fame has started blogging about his thoughts and experiences. This time he's talking about the incoming ES7 async functions support in React Native 0.7.
React Native Meets Async Functions on The Exponent Log
Great patterns for concurrency are one thing that make a codebase nice to work on. For user interfaces in particular, concurrency is what lets an app respond to gestures while it performs other work like fetching data from the server. Apps written with React Native are no exception, but they have a terrific advantage: they are written mostly in JavaScript, whose toolbox of concurrency patterns has evolved to include closures, promises, generators, and most recently, async functions.
Async functions
Async functions let you express your intent sequentially and run your code concurrently. This is a simple example that fetches data from a URL and parses the JSON response.
async function fetchJSONAsync(url) {
let response = await fetch(url);
let body = await response.json();
return body;
}
This code reads naturally to basically everyone who is familiar with programming, with a modest amount of new syntax.
The “async” keyword declares an async function, which means two things: it automatically returns promises and can use the “await” keyword. An async function returns promises that are resolved with function’s return value or rejected with uncaught errors.
The “await” keyword tells the program to temporarily exit the async function and resume running it when a given task completes. The program can run other code like gesture responders and rendering methods while the task is in progress.
You can await any promise. It is common to await the return value of an async function, which is just a promise. This means normal functions that return promises can masquerade as async functions.