It is said every javascipt object have internal prototype property,then predefined Function object also have the internal prototype property.So which object prototype does its internal prototype called proto points to?
function Object(){}
alert(Object.constructor)//function Function(){[native code]}
so i m referring to the internal prototype of the function Function(){} object not its prototype property . like Function object instance have their internal prototype pointing to Function object.prototype likewise Function object internal prototype point to what?not taking about the prototype property that gets added to it.I know what will the internal prototype of the prototype object points to.
All objects inherit from Object.prototype, but they may inherit from other prototypes as well depending on the type of object. Functions inherit from Function.prototype (which inherits from Object.prototype).
In Javascript, functions are just a specific type of object. Thus a function's prototype is the same thing as an object's prototype. For more reading on functions as objects, check out this link.
Related
According to image (Image is taken from Kyle simpson book this and Object prototypes)
Every function prototype has a prototype that is linked (or inheritin using Prototypical inheritance) to Object.prototype.
Object.prototype has a property i.e constructor that points Object.
Object even has a prototype property (that means it is also inheriting from Function’s prototype).
Function prototype has a constructor property that points to Function.
I don’t understand who is parent most Object or Function.
According to image Function is parentmost.
When you say "parentmost" I'm going to assume you're asking: What's the topmost thing in this image? The thing that everything else derives from? E.g., a "root" object.
The closest thing to a root object in that image is the object that Object.prototype points to, in the upper right-hand corner. That's the root object of the inheritance hierarchy shown in that image.
That object is the prototype of Function.prototype, which is the function object that is used as the prototype of all other functions by default, including the Function function, the Object function, etc. (It's possible to have functions with other prototypes — derived class constructors are one example — or even no prototype, but by default a function has Function.prototype as its prototype.)
Addressing your list:
Every function prototype has a prototype that is linked (or inheritin using Prototypical inheritance) to Object.prototype.
By "Every function prototype" I think you mean "the object on the prototype property of every function." That's true by default for functions that have a prototype property (not all do; arrow functions don't, for instance), but prototype is just a property, it can be changed.
Object.prototype has a property i.e constructor that points Object.
That's true, but it's not really relevant. (More below.)
Object even has a prototype property (that means it is also inheriting from Function’s prototype).
The fact Object has a prototype property doesn't have anything to do with it inheriting from Function's prototype. It has to do with the way the Object function is defined in the specification, which says that it has a prototype property that refers to the root object prototype.
Function prototype has a constructor property that points to Function.
That's true but also not really relevant.
The constructor property on the objects referred to by the prototype property of functions is very rarely used by JavaScript itself. (It wasn't used at all until ES2015.) It's not involved in the workings of inheritance, for instance. Since ES2015 it's been used in a few places to create new objects of the same subclass as other objects, for instance when Array.prototype.slice creates a new array, it uses the constructor property of the source array to create the new array.
The picture below shows that a function has a proto and a prototype, I understand that a proto is an object that is used to look up the chain. Does a prototype contain the actual prototype? Is that the distinction? Also the object A and B in this picture don't have a prototype property but I assume that if you create a prototype property it would show up on the object?
On MDN they state the following:
Properties are variables contained in the class; every instance of the
object has those properties. Properties should be set in the prototype
property of the class (function) so that inheritance works correctly.
Looking at the sections I've set to bold I assumed this meant:
myClass.prototype.newProperty = ...
However their example shows the following:
function Person(firstName) {
this.firstName = firstName;
console.log('Person instantiated');
}
var person1 = new Person('Alice');
var person2 = new Person('Bob');
// Show the firstName properties of the objects
console.log('person1 is ' + person1.firstName); // logs "person1 is Alice"
console.log('person2 is ' + person2.firstName); // logs "person2 is Bob"
In their example they're adding the property 'firstName' directly to the class/function using 'this'.
Does this mean:
a) That the function declaration is the prototype? I.e. myClass is the prototype which also has a property prototype which by default is set to Object?
b) That using 'this.' in the function declaration does actually add the property to the myClass.prototype
Edit: Updated title
JavaScript doesn't have classes, stop thinking in classes, because that doesn't work with JavaScript (yes, even with the ES6 class syntax, it's just sugar, there aren't actual classes in JavaScript).
By adding the property to the object's prototype, you ensure that it and any other objects with the same prototype will share this property, this means that they'll all have it, but it also mean that if you change it on one, it will change with all of them. Oops.
The creation of a new object with the new keyword is fairly straightforward:
Create an empty object
Make that object prototype the same prototype as the constructor's
Call the constructor with this as the newly created object.
So adding a property to the prototype of an object will have it shared among all instances of the same constructor, while adding it to this in the constructor will have it only on this specific instance. Because it's set in the constructor, it's safe to assume that all instances will have that variable in them, although it won't be shared with all other instances.
When you call a JavaScript property, the engine will look for it in the following fasion:
Look for the property on the object itself (that's this inside of methods of that object)
If not found, look for the property on the object's prototype
If not found, go up the prototype chain and look for it there
So in your Person example, the lookup chain will look like:
this > Person.prototype > Object.prototype
The constructor's will look like this:
this > Person.prototype > Function.prototype > Object.prototype
Person is a function, so its prototype is inherited from Function.prototype, similarly any function is an Object.
So to your specific questions:
The function declaration is not the prototype. See the object creation process above.
No, this applies the property on this instance, while prototype is shared among all instances.
I am new to JavaScript and I am following Douglas Crockford's book, The Good Parts.
It says:
Every function object is also created with a prototype property. Its value is an object with a constructor property whose value is the function. This is distinct from the hidden link to Function.prototype.
I understand that function objects are linked to Function.prototype, but what does the above line mean?
Can someone simplify it for me?
Every function object is also created with a prototype property.
var fn = function() { };
fn.hasOwnProperty("prototype"); // true
That is, for every function in JavaScript, each one has a prototype property, just like any other JavaScript object.
Its value is an object with a constructor property whose value is the function.
The object that prototype points to has a constructor property which points to the original function.
fn.prototype.constructor === fn // true;
That is, you can derive the constructor function from a constructed object by looking at obj.prototype.constructor (unless it's been overwritten).
This is distinct from the hidden link to Function.prototype
The function you create's prototype object is not the same as the Function's prototype.
fn.prototype != Function.prototype // true
That is, if you augment Function.prototype, then the methods will be available on function references. If you augment your function's prototype, then those methods will be available on constructed objects using that constructor.
I want to set multiple properties on the prototype of my object at once, since Object.defineProperties() takes an object(and prototype is an object) and descriptors, and my object obj has already a prototype as it comes with every object,i am trying to modify the prototype of my object as follows
var obj = document.createElement(tn);
obj.prototype = Object.defineProperties(obj.prototype,{
getName:{
value:function(){
alert("I have the tag"+this.tagName);
},
configurable:true
}
});
but I am getting an error:
Object.defineProperties called on non-object
why?
This is because, obj.prototype is undefined.
You point it to some other object, properties will be added to it.
JS has a prototype based inheritance model where an object inherits from another object, if it doesn't have a property or a method, it looks to its prototype object which is just another object with property and methods which again might have its own prototype object.
You are getting the error Object.defineProperties called on non-object simply because obj.prototype is not an object and is undefined.
set it to window or an empty {}, it should work for you.