How to Create an Async Function via “new Function”
One thing I love about JavaScript is that there are many ways to accomplish the same task, one such example being creating functions. There are several patterns for functions; one of the last you see used is the new Function
method:
/* new Function(arg1, arg2 (...), body) */
const myFunction = new Function('users', 'salary', 'return users * salary');
What if you want to use this new Function
method to create an async function? You need to be a bit clever, and thanks to MDN, we have an answer:
// Shim for allowing async function creation via new Function
const AsyncFunction = Object.getPrototypeOf(async function(){}).constructor;
// Usage
const fetchPage = new AsyncFunction("url", "return await fetch(url);");
fetchPage("/").then(response => { ... });
The usage of Object.getPrototypeOf(async function(){}).constructor
is super clever, as a native AsyncFunction
doesn't exist. I don't believe that I've ever used the new Function
pattern but that doesn't mean you don't! And now you can make them asynchronous!
![CSS Animations Between Media Queries]()
CSS animations are right up there with sliced bread. CSS animations are efficient because they can be hardware accelerated, they require no JavaScript overhead, and they are composed of very little CSS code. Quite often we add CSS transforms to elements via CSS during...
![6 Things You Didn’t Know About Firefox OS]()
Firefox OS is all over the tech news and for good reason: Mozilla's finally given web developers the platform that they need to create apps the way they've been creating them for years -- with CSS, HTML, and JavaScript. Firefox OS has been rapidly improving...
![jQuery Chosen Plugin]()
Without a doubt, my least favorite form element is the SELECT
element. The element is almost unstylable, looks different across platforms, has had inconsistent value access, and disaster that is the result of multiple=true
is, well, a disaster. Needless to say, whenever a developer goes...
![DWRequest: MooTools 1.2 AJAX Listener & Message Display]()
Though MooTools 1.2 is in its second beta stage, its basic syntax and theory changes have been hashed out. The JavaScript library continues to improve and become more flexible.
Fellow DZone Zone Leader Boyan Kostadinov wrote a very useful article detailing how you can add a...
fetch() is already an async function, can you change your example?