Why can't I set a JavaScript function's name property?

Question

I am learning JavaScript and read that functions are like objects and can have properties set like this:

var person = function(){
}
person.name="John Smith"; //output ""
person.age=21; //output 21
person.profession="Web Developer"; //output "Web Developer"

Why is the name property blank?

Thanks

Answer 1

Because name is a non-standard, non-writable property of function objects. Function declarations and named function expressions are named, while you have an anonymous function expression whose name is "".

You probably wanted a plain object:

var person = {
    name: "John Smith",
    age: 21,
    profession: "Web Developer"
};

Answer 2

name is a special property because it gives the name of the function when defined like this:

function abc(){

}

In this case name would return the string "abc". This name cannot be changed. In your case, the function does not have a name, hence the empty string.

http://jsfiddle.net/8xM7G/1/

Answer 3

You can change the name property!

The Function.name property is configurable as detailed on MDN.

Since it's configurable, we can alter its writable property so it can be changed. We need to use defineProperty to do this:

var fn = function(){};
Object.defineProperty(fn, "name", {writable:true});
// now you can treat it like a normal property:
fn.name = "hello";
console.log(fn.name); // outputs "hello"

Answer 4

You may want to use Prototype (see How does JavaScript .prototype work?) or simply turn the 'person' into a hash like so:

var person = {};
person.name="John Smith"; //output "John Smith"
person.age=21; //output 21
person.profession="Web Developer"; //output "Web Developer"

Answer 5

You can use Object.defineProperty to change the value of the property (even without touching its writeable flag):

function fn () {}
console.log(fn.name) // Outputs fn

Object.defineProperty(fn, 'name', { value: 'newName' })

console.log(fn.name) // Outputs newName

Answer 6

The name property is set by the Function constructor and cannot be overwritten directly. If the function is declared anonymous, it will be set to an empty string.

For example:

var test = function test() {};
alert(test.name); // Displays "test"
test.name = "test2";
alert(test.name); // Still displays "test"