JavaScript In Practice: ES6 And Beyond/

...

/

Name Property

Name Property

name property in ES5 and its limitations

We'll cover the following...

The name of a function can be retrieved using the name property of a function.

Press + to interact
let guessMyName = function fName() {};
let fName2 = function() {};
let guessMyProperty = {
    prop: 1,
    methodName() {},
    get myProperty() {
        return this.prop;
    },
    set myProperty( prop ) {
        this.prop = prop;
    }
};
console.log( guessMyName.name );
//> "fName"
console.log( fName2.name );
//> "fName2"
console.log( guessMyProperty.methodName.name  );
//> "methodName"
console.log( guessMyProperty.methodName.bind( this ).name  );
//> "bound methodName"

When it comes to getters and setters, retrieving method names is a bit more complicated:

Press + to interact
let propertyDescriptor = Object.getOwnPropertyDescriptor(
        guessMyProperty, 'myProperty' );
console.log( propertyDescriptor.get.name );
//> "get myProperty"
console.log( propertyDescriptor.set.name );
//> "set myProperty"

Function names provide you with limited debugging capabilities. For instance, you can ...