Function.prototype.method what is prototype[name]

Question

I'm trying not to duplicate questions obviously as I have seen some questions/answers regarding Douglas Crockford's Javascript the Good parts book

I understand most of this code

Function.prototype.method = function (name, func) {
this.prototype[name] = func;
return this;
};
Function.method('inherits', function (Parent) {
this.prototype = new Parent( );
return this;
});
var Mammal = function (name) {
this.name = name;
}.method('get_name', function () {
return this.name;
}).method('says', function() {
return this.saying || '';
});
var Cat = function (name) {
this.name = name;
this.saying = 'meow';
}.inherits(Mammal)
var myCat = new Cat('bagsley');
myCat.get_name();

what I'm having trouble getting is the this.prototype[name] why isn't it written as this.prototype.name; I know returning this allows chaining and the syntax here looks very similar to jQuery but I still don't get the prototype[name] part

Any help is apprecaited thanks

• Jack: stackoverflow.com/questions/4968406/…
• elclanrs: It's assigning the parameters to a new object that's why can't use the dot notation.
• Šime Vidas: @elclanrs No, the dot notation cannot be used because the property name is a dynamic string.
• elclanrs: Yeah that's what I was thinking just expressed my self wrong. name is a string

Answer 1

There is a difference between obj.name and obj[name].

This...

obj.name = 123;

...will assign the value 123 to the "name" property (of the object).

On the other hand, this...

obj[ name ] = 123;

...will assign the value 123 to those property which name is equal to the value of the name variable/argument.

So:

var name = 'foo';
obj.name = 123;
obj[ name ] = 456;
// And now:
obj.name; // 123
obj.foo; // 456

• James Daly: i plugged this into firebug and it worked as to prove your point but obviously I would never run this code var name = 'frank' Function.prototype.method = function (name, func) { this.prototype.frank = func; return this; }; Function.method('frank', function (Parent) { this.prototype = new Parent( ); return this; }); var Mammal = function (name) { this.name = name; }.method('frank', function () { return this.name; }) var Cat = function (name) { this.name = name; this.saying = 'meow'; }.frank(Mammal) var myCat = new Cat('bagsley'); myCat.frank()
• Šime Vidas: @user974959 Hm, I didn't quite get your last comment. Do you have another question?
• James Daly: no question just putting your answer to practice meaning this would work ... var name = 'frank' Function.prototype.method = function (name, func) { this.prototype.frank = func; return this; }
• Šime Vidas: @user974959 I don't understand that code. Why did you hard-code this.prototype.frank? The method method will not work properly if it's defined like that. It has to be this.prototype[name], so that the argument value is used for the name...
• James Daly: it could if every method's name was 'frank' however it's not intended to work that way obviously was just illustrating the difference and why it's preferable to use brackets instead of .notation - just putting what I learned to practice basically

Answer 2

prototype[name] allows name to be a variable containing any string, and it will access the property of prototype named by the string. prototype.name would look for the property literally called "name".

The [] syntax allows you to:

1. Have variable property names - especially useful when looping through properties with for..in
2. Use symbols in property names that are otherwise disallowed (eg. obj['foo-bar'], arr[123])
3. Have closer resemblance to the associative arrays of other languages such as PHP.

• James Daly: thanks for your answer Kolink it was very helpful I appreciate your feedback