constructor.name is undefined in Internet Explorer

问题

My debugging work in IE ended today by finding that constructor.name is undefined.

I created the following simple code that reproduces the issue:

({}).constructor.name === undefined // => true

Is there any workaround to make this work?

Maybe overriding somehow the prototype?

If possible, I don't want to change the syntax, because the change would be major.

JSFIDDLE

回答1:

The problem is simply that the name property of function objects is not supported in Internet Explorer. The property is non-standard (up until ECMAScript 6, at least) so it's not altogether surprising.

There isn't a completely reliable workaround so I would suggest trying to do without it if possible. However, you may be able to extract the name from the string representation of the function. Here a couple of links that deal with this that I got from a quick search:

Javascript get Function Name?
https://gist.github.com/dfkaye/6384439

Update

From the comments, it turns out that the goal of the question author is to test whether a variable is a reference to a plain object create by the Object constructor. A reliable way of doing this for a variable a is

Object.prototype.toString.call(a) == "[object Object]"

For more information I recommend the following page written by Angus Croll:

http://javascriptweblog.wordpress.com/2011/08/08/fixing-the-javascript-typeof-operator/

回答2:

From matt.scharley.me

/**
 * Hack in support for Function.name for browsers that don't support it.
 * IE, I'm looking at you.
**/
if (Function.prototype.name === undefined && Object.defineProperty !== undefined) {
    Object.defineProperty(Function.prototype, 'name', {
        get: function() {
            var funcNameRegex = /function\s([^(]{1,})\(/;
            var results = (funcNameRegex).exec((this).toString());
            return (results && results.length > 1) ? results[1].trim() : "";
        },
        set: function(value) {}
    });
}

回答3:

Perhaps this example clears up some confusion.

var number = 10;        //A global variable. Part of the global window object.
//window.number = 10;   //Does exactly the same as the line above.


var customer = {
    number: 20,
    speak: function () {
        if (this === window) {
            alert('I am being called by go() ' + this.number);      //this.number points to the global variable number
        } else {
            alert('I am being called by customer.speak ' + this.number);  //this.number points to the customer member number
        }
    }
}

var go = customer.speak;  //Go now points directly to the function called "speak" as if it is not a part of the customer object. The this parameter of speak will be the global window object;

go();
customer.speak();         //Now the speak function is called a part of the customer object. The this parameter of speak will be the customer object

回答4:

This is an improvisation from Oliver's answer.

Instead of using regex, this method will parse the string once and save it to the scope to avoid performance problem if it's called more than once.

if(Function.prototype.name === undefined){
    Object.defineProperty(Function.prototype, 'name', {
        get:function(){
            if(!this.__name)
                this.__name = this.toString().split('(', 1)[0].split(' ')[1];
            return this.__name;
        }
    });
}

回答5:

I wrote this for my needs (acknowledging it may not be full-proof):

if (!Object.constructor.prototype.hasOwnProperty('name')) {
    Object.defineProperty(Object.constructor.prototype, 'name', {
        get: function () {
            return this.toString().trim().replace(/^\S+\s+(\w+)[\S\s]+$/, '$1');
        }
    })
}

The regex being performed in the method is making an assumption that the 2nd non-whitespace group of characters IS the name of the constructor. This is a viable solution for the code that I'm working with, while this may not be full-coverage for all others' needs.