`new function()` with lower case “f” in JavaScript

问题:

My colleague has been using \"new function()\" with a lower case \"f\" to define new objects in JavaScript. It seems to work well in all major browsers and it also seems to be fairly effective at hiding private variables. Here\'s an example:

    var someObj = new function () {
        var inner = \'some value\';
        this.foo = \'blah\';

        this.get_inner = function () {
            return inner;
        };

        this.set_inner = function (s) {
            inner = s;
        };
    };

As soon as \"this\" is used, it becomes a public property of someObj. So someObj.foo, someObj.get_inner() and someObj.set_inner() are all available publicly. In addition, set_inner() and get_inner() are privileged methods, so they have access to \"inner\" through closures.

However, I haven\'t seen any reference to this technique anywhere. Even Douglas Crockford\'s JSLint complains about it:

• weird construction. Delete \'new\'

We\'re using this technique in production and it seems to be working well, but I\'m a bit anxious about it because it\'s not documented anywhere. Does anyone know if this is a valid technique?

回答1:

I\'ve seen that technique before, it\'s valid, you are using a function expression as if it were a Constructor Function.

But IMHO, you can achieve the same with an auto-invoking function expression, I don\'t really see the point of using the new operator in that way:

var someObj = (function () {
    var instance = {},
        inner = \'some value\';

    instance.foo = \'blah\';

    instance.get_inner = function () {
        return inner;
    };

    instance.set_inner = function (s) {
        inner = s;
    };

    return instance;
})();

The purpose of the new operator is to create new object instances, setting up the [[Prototype]] internal property, you can see how this is made by the [Construct] internal property.

The above code will produce an equivalent result.

回答2:

Your code is just similar to the less weird construct

function Foo () {
    var inner = \'some value\';
    this.foo = \'blah\';

    ...
};
var someObj = new Foo;

回答3:

To clarify some aspects and make Douglas Crockford\'s JSLint not to complain about your code here are some examples of instantiation:

1. o = new Object(); // normal call of a constructor

2. o = new Object;   // accepted call of a constructor

3. var someObj = new (function () {  
    var inner = \'some value\';
    this.foo = \'blah\';

    this.get_inner = function () {
        return inner;
    };

    this.set_inner = function (s) {
        inner = s;
    };
})(); // normal call of a constructor

4. var someObj = new (function () {  
    var inner = \'some value\';
    this.foo = \'blah\';

    this.get_inner = function () {
        return inner;
    };

    this.set_inner = function (s) {
        inner = s;
    };
}); // accepted call of a constructor

In example 3. expression in (...) as value is a function/constructor. It looks like this: new (function (){...})(). So if we omit ending brackets as in example 2, the expression is still a valid constructor call and looks like example 4.

Douglas Crockford\'s JSLint \"thinks\" you wanted to assign the function to someObj, not its instance. And after all it\'s just an warning, not an error.