When I Assign Prototype To Function I Get Undesired Output
Solution 1:
The problem with functions is that they do have a non-writable .name
property. This non-writability even affects the objects that inherit from the function, in your case the Student
instances, so the assignment fails:
varStudent = function(name){
console.log(this.name);
this.name = name;
console.log(this.name);
};
Student.prototype = functionProtoName() {};
console.log(Student.prototype.name);
newStudent("test");
You'll just see the string "ProtoName"
thrice.
You can use strict mode to make it more obvious that the .name =
fails:
varStudent = function(name){
"use strict";
this.name = name;
};
Student.prototype = functionProtoName() {};
newStudent("test");
You'll get an Error: Invalid assignment in strict mode
.
You can work around the non-writability by creating the .name
property on the Student
instance using Object.defineProperty
instead of the simple assignment, but really you just should not use a function object as a prototype.
Solution 2:
You seem to have a misunderstanding of what prototypes are and how you should use them. I will refactor your code and tell you why this works the way it works, as well as the general consensus for how to use them:
You declare a function - this is called the Constructor
function. It will construct all the variables etc..
functionStudent(firstname, lastname){
this.firstname = firstname;
this.lastname = lastname;
}
Your prototype is an object with keys
and values
. This is simply because your prototype will not exist on actual products, it will act as if it's right there on the element (and not in element.prototype). We'll get to that, but for now you should keep in mind that variables are best declared inside your constructor function above, and methods are best in the prototype. You can mix them, but it's an easy divide and it keeps your code clear.
Student.prototype = {
showName: function(){ returnthis.firstname + ' ' + this.lastname; }
};
Now when we construct an instance of student, we can use the method showName
as such:
var gonzales = newStudent('Johny','Gonzales');
console.log(gonzales.showName()); // 'Johny Gonzales'
Also note that we do not mention the prototype on a consturcted object. It is still 'available' in __proto__
as it's inherited etc... But from a normal point of view this does not matter.
Variables are also directly accessible, using by simple using dot notation. By the way, keep in mind that variables and methods share the same namespace!
console.log(gonzales.firstname); // Johny
You cannot set the prototype as a function itself (unless it is a self executing function that returns an object). Functions
in javascript, although considered objects, are different beasts with their own magic - do not treat them like objects as they will not treat it kindly. Don't try to do this, as it can break some Javascript inheritance and will create countless bugs you cannot squash.
For more details and accurate naming, see this article: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Introduction_to_Object-Oriented_JavaScript#Custom_objects
Solution 3:
While it is true that an function in JS in the end is also an Object, it's not the same way the other way around, since that would mean every Object is also a function.
The prototype Object holds all the functions the prototype has. This is VERY important for Object inheritance and the like.
If you think back to memory schema's it's like this:
{
hi : function hi(){}, // pointer to the function 'hi'
bye : function bye(){}, // pointer to function 'bye'
data : { planet : 'earth' } // pointer to an Object with a pointer to a String which contains 'earth'
}
If you overwrite the Object with a function, it all dies. Mainly since JS 'knows' that a the an Objects prototype is supposed to hold functions or other objects, and does not 'execute' the prototype Object itself.
So basically, it's more like an index used by JS to find stuff that you may or may not need in an Class' instance
Solution 4:
When you set the prototype of the Student
object like this :
Student.prototype = function(){
print("Inside Prototype function");
};
The prototype of Student
will be this simple function as @somethinghere pointed out, (instead of containing the function constructor
and the object __proto__
), so all the properties and the functions of Student
will be removed. This is why the property name
will be removed.
And when you add the second property lastname
to Student
:
Student.prototype.lastName = "Gonzales";
The prototype of Student
will now has the property lastname
.
And as @somethinghere pointed out :
every instance of Student will now share that last name
Post a Comment for "When I Assign Prototype To Function I Get Undesired Output"