This question already has an answer here:
What is - function Empty() - in javascript ? [duplicate]
(1 answer)
Closed 7 years ago.
I created a simple constructor like:
function Car() {
this.noTires = 5;
}
Car.__proto__ prints out Empty() {}
What does this mean?
protoype is a property of every constructor
It is an object which is a prototype of a new instance.
you can define it something like this.
Car.prototype.name="Audi";
Car.prototype.model="A4";
making a constructor does not mean making a prototype.
Prototypes are used when we want to make instances pointeng to the same block
eg.
function Person(){
}
Person.prototype.name = "detailer";
Person.prototype.age = 17;
Person.prototype.job ="Developer"
Person.prototype.sayName = function(){
alert(this.name);
};
var person1 = new Person();
var person2 = new Person();
person1.name = "lakshay";
alert(person1.name); //lakshay - from instance
alert(person2.name); //detailer - from prototype
Related
This question already has answers here:
Use of 'prototype' vs. 'this' in JavaScript?
(15 answers)
Closed 6 years ago.
As output of both the below JS class is same, then what is special here with prototype?
One of the feature of prototype is get rid of duplicate code, in what case this is possible with prototype?
1.
function Person(name) {
this.name = name;
this.sayName = function () {
console.log(this.name);
};
}
var person1 = new Person("Nicholas");
person1.sayName();
2.
function Person(name) {
this.name = name;
}
Person.prototype.sayName = function () {
console.log(this.name);
};
var person1 = new Person("Nicholas");
person1.sayName();
If you assign a property by using prototype then those properties will be shared through out all the instances of the class/constructor which has the particular prototype. But assigning a property using this inside of the constructor will be instance-specific. They cannot be shared with other instances. Each instances will have their own value in it.
This question already has answers here:
JavaScript private methods
(34 answers)
Closed 6 years ago.
I want function to be available on a object, but I don't it to be visible if if I console.log it or send it to another function.
var obj = function() {
this.name = 'Bob';
this.age = 23;
}
obj.prototype.say = function() {
console.log(this.name, this.age, 'thats me..');
}
var pers = new obj();
console.log(pers); // { name: 'Bob', age: 23 }
pers.say(); // Bob 23 thats me..
Would this be good for solution and good practice for that? Or is it a better way to accomplish this in javascript?
Functions created by using prototype would also be visible when you log the object. The only thing you can do at this context is to create functions in your constructor using this and create a closure. And these functions will not be a shared functions among the object instances unlike prototypal functions. I mean, the function's change will not be reflected in all object instances.
var obj = function() {
this.name = 'Bob';
this.age = 23;
function privateTest(){ alert("hai"); }
this.test = privateTest;
}
This question already has answers here:
Use of 'prototype' vs. 'this' in JavaScript?
(15 answers)
Closed last month.
In the below code,
function Person(first, last, age) {
this.firstName = first;
this.lastName = last;
this.age = age;
}
Person.prototype.planet = "Earth";
p1 = new Person("David", "Beckham", 39);
p2 = new Person("Lionel", "Messi", 30);
If multiple instances p1 p2 are created using constructor Person, then
How do I understand the difference about the property planet with property age? What difference it would make by adding property planet as this.planet in the constructor Person?
Note: Understanding prototype property
Consider situation when in the fututre we are going to change prototype property that is shared by all instances
function Person(first, last, age) {
this.firstName = first;
this.lastName = last;
this.age = age;
}
Person.prototype.planet = "Earth";
p1 = new Person("David", "Beckham", 39);
p2 = new Person("Lionel", "Messi", 30);
console.log(p1.planet) // Earth
Person.prototype.planet = "Mars"
console.log(p1.planet) // Mars
console.log(p1.planet === p2.planet) // true
Changing one property on prototype will change it in all instances
A prototype property will be part of any object created from the so-called prototype, and this includes prototype chain.
A instance property will be part of the whole instance, and in your case, it will part of any instance because you're adding it within the constructor function:
function A() {
this.x = 11;
}
var instance = new A();
instance.x = 11;
Both above cases are adding the property to the own object rather than in the prototype.
Furthermore, adding properties to the prototype has a side effect:
function A() {}
A.prototype.x = 11;
function B() {}
B.prototype = Object.create(A.prototype);
var instanceA = new A();
var instanceB = new B();
A.prototype.x = 12;
// Both "x" will hold 12
alert(instanceA.x);
alert(instanceB.x);
Learn more about prototype chain on MDN.
About some OP comment
So, In java terminology, age is an instance member and planet is a
static member. To define a static member, we use prototype property,
am I correct? –
This is a wrong statement.
Prototype properties aren't static, since prototypes are regular objects. It's just JavaScript uses prototype chain to implement inheritance and it relies in a standard property called prototype.
In JavaScript there're no statics. When you access any property, JavaScript's runtime will look for it through the prototype chain:
function A() {};
A.prototype.x = 11;
function B() {};
B.prototype = Object.create(A.prototype);
function C() {};
C.prototype = Object.create(B.prototype);
var instanceC = new C();
var x = instanceC.x;
// Once you request a property "x", the runtime will do the following process:
// 1) Is "x" in the own object? No, then 2)
// 2) Is "x" in current object's prototype? No, then 3)
// 3) Is "x" in the parent prototype? No, then 4)
// 4) And so on, until it reaches the top-level prototype, and if this has no
// "x" property, then runtime will return "undefined"
It's actually memory usage. Here are some images I have created depicting each problem.
In the image below, each instance of person is linked to the same prototype object. This saves memory if multiple instances are created pointing to the same object. However, if you change 'Earth' to 'Mars' every instance will have the same change.
In the image below each instance will point to a completely different property linked specifically to that instance. If you believe a specific planet can change names, you should do this.. otherwise use prototype because this will use more resources.
This question already has answers here:
JavaScript inheritance: Object.create vs new
(5 answers)
Closed 7 years ago.
I know this question was answered so many times, but I am so confused about how to inherit (yes, inherit....again) two Javascript functions.
Assumed that I have a class called 'Base' which is the one that I want to inherit;
function Base(model)
{
var self=this;
self._model=model;
return self;
}
Base.prototype.modelName= function()
{
return self._model.Name;
};
Then I create a new class call Foo.
function Foo()
{
var self=this;
self.hello=function()
{
return 'Hello World';
}
return self;
}
What code should I add to the Foo class to be able to do something like this?
var myModel={type:1, name:'My Model'};
var myObj=new Foo(myModel);
var result= MyObj.modelName();
I know I should use the object.create() method, but I cannot understand exactly how! :(
Thank you guys, and again sorry for this silly question.....I am really struggling with this basic concept here!!!!
JavaScript uses prototypal inheritance. To inherit from Base class, use like
Foo.prototype = new Base();
But you can't pass parameters into Foo. You need to move model save logic to Foo.
NOTE: Don't return the created object from constructor functions. By default, created object is returned.
EDITED
function Base() {
}
Base.prototype.modelName = function () {
return self._model.Name;
};
function Foo(model)
{
this._model = model
this.hello = function () {
return 'Hello World';
}
}
Foo.prototype = new Base();
This question already has answers here:
Javascript "OOP" and prototypes with multiple-level inheritance
(3 answers)
Closed 9 years ago.
i have a base class
function Base(){
this.children = new Array();
}
Base.prototype.Add = function(child){
this.children.push(child)
}
function Sub1(){...}
Sub1.prototype = new Base();
function Sub2(){...}
Sub2.prototype = new Base();
so how come when i do
var S1_1 = new Sub1();
var S1_2 = new Sub1();
S1_1.Add(new Sub2());
S1_2 for some reason also has 1 child and contains the same information as the child i added to S1_1?
It's because that's how prototypal inheritance works. All your Sub1 objects inherit from a common Base object. Because the Base object holds the Array, all Sub1 instances share that Array.
In other words, when you ask for the .children property of each Sub1 object, they will see that they don't own such a property, and will therefore look for it on the prototype from which they inherit. Since they inherit from the same prototype object, they use the same Array.
For each Sub1 to have its own Array, you should define it in the Sub1 constructor.
function Base(){
this.children = new Array();
}
Base.prototype.Add = function(child){
this.children.push(child); // `this` will be whatever object invoked the method
}
function Sub1(){
this.children = [];
}
Sub1.prototype = new Base();
function Sub2(){
this.children = [];
}
Sub2.prototype = new Base();
You didn't take ownership/copy of the Base variables defined with this when creating a sub, you can do so with:
function Sub1(){
Base.call(this);
}
What that code does is calling Base with the Sub1 instance as the this context.
More on prototype behavior can be found here: Prototypical inheritance - writing up