Creating functions dynamically with JavaScript

Creating functions dynamically with JavaScript

The Function constructor is something that isn't usually talked about in JavaScript circles, but it is a useful mechanism to have that allows you to generate functions dynamically based on a string input. Here is a quick example of it in action before we dive into it a bit more.

let add = new Function("num1", "num2", "return num1 + num2");

console.log(add(1, 3));

The constructor consists of 2 "types" of arguments. The first type is a comma-separated list of argument names belonging to the new function, and the second is the actual code for the function body itself as a string. After you have declared the Function constructor you can call it as you would a regular function in JavaScript.

If you are new to JavaScript, then I recommend the following book Web Design with HTML, CSS, JavaScript and jQuery, which can get you up and running pretty quickly with JavaScript.

Default parameters

Thanks to added ES6 functionality, you can also include default parameters to your dynamic function as such:

let add = new Function("num1", "num2 = 0", "return num1 + num2");

console.log(add(1));  // returns 1

In this case leaving out the second argument would simply default it to the value of 0 to prevent any Nan scenario.

Using rest parameters

Again, thanks to ES6, you can also use the rest operator as the first argument if you are unsure of the number of arguments that the function will include, or if they vary in number from function call to function call:

let getCount = new Function("...args", "return args.length");

console.log(getCount(1, 2, 3));	// returns 3
console.log(getCount(1, 2)); // returns 2

Use cases

One potentially powerful use case scenario for creating dynamic functions, is the ability to be able to store your JavaScript externally in some type of database or repository and then to be able to regenerate this function on the fly. Essentially, it's how the browser works pretty much. It reads in a JavaScript file, which is a string, and it runs the code through the JavaScript engine.

You could also potentially have incredibly dynamic logic that changes based on multiple variables and/or parameters and require this flexibility.

Security issues

It's important to note that running code from an external source, opens it up to the possibility of code injection. For that reason you would want to avoid using the Function constructor to run any kind of user-generated input and use it only within the confines of your own internal generated data.

I think in the future we'll definitely be seeing much more of this procedure as technology and coding techniques advance in nature. For now, if you have any unique use cases for dynamic function creation, comment down below.

Walter G. author of blog post
Walter Guevara is a Computer Scientist, software engineer, startup founder and previous mentor for a coding bootcamp. He has been creating software for the past 20 years.

Get the latest programming news directly in your inbox!

Have a question on this article?

You can leave me a question on this particular article (or any other really).

Ask a question

Community Comments

A
Angel Ramos
8/27/2020 8:40:03 PM
That was an amazing post, it was usefully to know how to do some store queries.

Add a comment