Skip to content Skip to sidebar Skip to footer

When I Assign Prototype To Function I Get Undesired Output

Please follow the code below, var fn79 = function(){ var Student = function(_name){ this.name = _name; }; Student.prototype = function(){ print('Insi

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

More informations about the prototype of an Object

Post a Comment for "When I Assign Prototype To Function I Get Undesired Output"