# JS Tip of the Day: New Functions With new

**URL:** <https://forum.kirupa.com/t/js-tip-of-the-day-new-functions-with-new/643143>\
**Category:** web dev\
**Created:** [March 24, 2020, 1:36pm UTC](https://forum.kirupa.com/t/js-tip-of-the-day-new-functions-with-new/643143 "2020-03-24T13:36:38Z")\
**Posts on this page:** 1\
**Page:** 1

<div class="post-metadata">

**Author:** ![senocular](https://yyz1.discourse-cdn.com/flex011/user_avatar/forum.kirupa.com/senocular/32/7217_2.png) [@senocular](https://forum.kirupa.com/u/senocular)\
**Post date:** [March 24, 2020, 1:36pm UTC](https://forum.kirupa.com/t/js-tip-of-the-day-new-functions-with-new/643143/1 "2020-03-24T13:36:38Z")

</div>

**New Functions With new**  
Version: ES2015 (generator), ES2017 (async)  
Level: Advanced

Just about any time you create a new function in JavaScript, you’re more than likely going to be using some kind of function declaration or expression to do so. But functions, being objects, also have a constructor. And that constructor can be used to create new functions, just like any other object constructor can be used to create new objects.

The `Function` constructor is called using `new Function()` (or just `Function()`) and takes a variable number of arguments. The last argument is a string representing the code in the body of the function while every other argument before that represents its parameter names.

```javascript
let logger = new Function('value', 'console.log("[LOG] " + value)');
logger('is wood'); // [LOG] is wood

```

Functions created with the `Function` constructor are similar to function expressions created with the `function` keyword. One noticeable difference is that code within the `Function` constructor does not have access to any outside scope other than global. While this can be limiting, it can also make it a safer alternative to `eval` since it doesn’t expose variables in other scopes.

```javascript
function runSecretTest () {
    let local = 'secret';

    function normal () {
        console.log('Normal: ' + local);
    }
    function evaled () {
        eval('console.log("Eval: " + local)');
    }
    let constructed = new Function(
        'console.log("Constructor: " + local)'
    );

    normal(); // Normal: secret
    evaled(); // Eval: secret
    constructed(); // ReferenceError: local is not defined
}

runSecretTest();

```

Unique function constructors also exist for generator and async functions (and async generator functions). Unfortunately, these are not exposed globally. To get access to these constructors, you’d need to make a generator or async function first, then access their `constructor` properties.

```javascript
let GeneratorFunction = (function * () {}).constructor;
let count3 = new GeneratorFunction(
    'yield 1; yield 2; yield 3;'
);
console.log([...count3()]); // [1, 2, 3]

let AsyncFunction = (async function () {}).constructor;
let delay3 = new AsyncFunction(
    'return 3'
);
delay3()
    .then(value => console.log(value)); // 3

```

There is no constructor for arrow functions. If you attempt to access `constructor` from an arrow function, it will refer to the standard `Function` constructor. The only way to create an arrow function with arrow function-like behavior is using arrow function syntax.

```javascript
let arrow = () => {};
console.log(arrow.constructor === Function); // true

```

More info:

- [Function constructor on MDN](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Function/Function)
- [GeneratorFunction on MDN](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/GeneratorFunction)
- [AsyncFunction on MDN](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/AsyncFunction)
