Meaning of prototype in javascript

javascript prototype explained
what is prototype in javascript
javascript prototype inheritance
inheritance in javascript
prototype chain in javascript
string prototype javascript
closure in javascript
javascript prototype vs class

I wrote short code of inheritance of reader from Person:

<script>

/* Class Person. */
function Person(name) {
    this.name = name;
}

Person.prototype.getName = function() {
    return this.name;
}

var reader = new Person('John Smith');
alert(reader.getName());

</script>

Alternatively I can delete the line of Person.prototype.getName = function() { return this.name; } and create it in the Person object. For example

<script>
/* Class Person. */
function Person(name) {
    this.name = name;
    this.getName = function() { return this.name;}
}

var reader = new Person('John Smith');
alert(reader.getName());

</script>

I got the same result when invoking getName() in both these cases. So how are they different?

When you put something on the prototype, every instance of the object shares the same code for the method. They are all using the same function instance.

When you simply put a method on this, every object instance has its own copy of the same method.

Using prototype is much more efficient. Note this is why typically methods are placed on the prototype, since you typically want all instances to use the same method, but properties are placed on the instance itself, because typically you don't want all instances to share the same properties.

For your comment, if you put a method on the constructor function of an object, then you have in effect created a "static" method. No instance of the object will have that method, they all must access it on the constructor function. So in your case, Person.someMethod().

JavaScript String prototype Property, All JavaScript objects inherit properties and methods from a prototype. In the previous chapter we learned how to use an object constructor: Example. function​  The answer is Prototype. The prototype is an object that is associated with every functions and objects by default in JavaScript, where function's prototype property is accessible and modifiable and object's prototype property (aka attribute) is not visible. Every function includes prototype object by default.

When you put the method in the constructor and create an object out of that constructor, each object carries it's own getName function. For 10 Person instances, each carries it's own getName, therefore 10 separate getName functions.

If you place getName in the prototype of the constructor, that same getName function is shared/inherited across all instances. so for 10 instances of Person, each has getName but refer only to 1 getName function.

Using prototypes saves memory since the method is shared across instances so only one is used.

JavaScript Prototypes, When you put something on the prototype, every instance of the object shares the same code for the method. They are all using the same  JavaScript is often described as a prototype-based language — to provide inheritance, objects can have a prototype object, which acts as a template object that it inherits methods and properties from. An object's prototype object may also have a prototype object, which it inherits methods and properties from,

The difference is that when you put it on the prototype, all instances of Person share the same code for getName -- you can change getName on all instances of Person by assigning something else:

Person.prototype.getName = function() { return 'Mr Jones' };

Also, since they share the same code, it's less memory intensive: You only have one copy of the getName function, instead of one copy per instance.

Another difference is that you can later set the Person as the prototype of another class, let's say Man, and it will inherit the properties/methods.

Update: Here is a good post explaining other properties of prototypes: https://stackoverflow.com/a/1534286/295262

Meaning of prototype in javascript, Well, to be exact, the properties and methods are defined on the prototype  When you put something on the prototype, every instance of the object shares the same code for the method. They are all using the same function instance. When you simply put a method on this, every object instance has its own copy of the same method. Using prototype is much more efficient.

The difference is that is you further extend the Person class the sub classes will not inherit the getName() method

Edit: I was not correct in above statement. Just tested on the jsfiddle. Regardless of if we define a method on the prototype or on the function instance itself, it is available for the subclasses in the chain.

Here is the proof: http://jsfiddle.net/u8qrd/

I understand that there is a performance/memory benefit of attaching the methods to prototype. Appart from that isn't there any behavioral difference when it comes to inheritance?

(hopefully I'm not violating SO rules by asking a question here)

Object prototypes, In this post, we will discuss what are prototypes in JavaScript, how they help JavaScript in achieving Now, let's define a property name on the person1 object When a function is created in JavaScript, the JavaScript engine adds a prototype property to the function. This prototype property is an object (called as prototype object) which has a constructor property by default. The constructor property points back to the function on which prototype object is a property.

In class-based words the difference between declaring a function via prototype and this would be something like this:

prototype:

the function of the instance would look like this:

somefunc = function(){super()/*call the function of the super-class*/};

this:

the function of the instance would look like this:

somefunc = function(){/* Do same stuff as in the prototype func declared */};

Now changing the function on the prototype will have no effect on the instance.

Prototypes in JavaScript - Better Programming, Prototypes allow you to easily define methods to all instances of a particular object. The beauty is that the method is applied to the prototype, so it  JavaScript is a prototype-based language, meaning object properties and methods can be shared through generalized objects that have the ability to be cloned and extended. This is known as prototypical inheritance and differs from class inheritance.

Using Prototypes in Javascript, What does 'Space Complexity' mean? Pseudo-polynomial Algorithms · Polynomial Time Approximation Scheme · A Time Complexity Question · Searching  That prototype property is somewhat like a class definition in other object-oriented langauge; but it is more than that. It is actually an instance of an object and every function in JavaScript has one whether you use it or not. Every function (constructor function or not) has a prototype object instance hanging off of it, interesting, huh?

Prototype in JavaScript, JavaScript Prototype - Function defined. Second, add a new method named whoAmI() to the Foo.prototype object: Foo.prototype.whoAmI = function() { return "​I  First, every JavaScript function has a prototype property (this property is empty by default), and you attach properties and methods on this prototype property when you want to implement inheritance. This prototype property is not enumerable; that is, it isn’t accessible in a for/in loop.

JavaScript Prototype, create(parent) , whenever there's a failed property lookup on child , JavaScript will delegate Duration: 28:23 Posted: Oct 4, 2018 All objects in JavaScript are descended from Object. All objects inherit methods and properties from Object.prototype, although they may be overridden. For example, other constructors' prototypes override the constructor property and provide their own toString() methods.

Comments
  • net.tutsplus.com/tutorials/javascript-ajax/…
  • and if I put it as function of Person what is the different ?
  • I don't know that there is a difference in the outcome (I don't know about technically), adding to the Person function implies that you used the function constructor pattern. Also, with the use of Person.prototype you can add things to the Object definition later on in your program, not specifically to Person = function () {} at the time it is defined.
  • can you give me a short code example about the constructor function object? mean which you have said in the last paragraph? I'm new to javascript that's why didn't understand by theory. if you put a method on the constructor function of an object, then you have in effect created a "static" method
  • Why should someone set the Person prototype as the prototype of Man? When comes to inheritance, shouldn't it be in the form Man.prototype = new Person(); instead of Man.prototype = Person.prototype?