" Every object (including functions) has this internal property called [[prototype]]"
Every function has a proto- type object that’s automatically set as the prototype of the objects created with that function.
you guys can check easily:
const a = { name: "something" };
console.log(a.prototype); // undefined because it is not directly accessible
const b = function () {
console.log("somethign");};
console.log(b.prototype); // returns b {}
But every function and objects has __proto__
property which points to the prototype of that object or function. __proto__
and prototype
are 2 different terms. I think we can make this comment: "Every object is linked to a prototype via the proto " But __proto__
does not exist in javascript. this property is added by browser just to help for debugging.
console.log(a.__proto__); // returns {}
console.log(b.__proto__); // returns [Function]
You guys can check this on the terminal easily. So what is constructor function.
function CreateObject(name,age){
this.name=name;
this.age =age
}
5 things that pay attention first:
1- When constructor function is invoked with new
, the function’s internal [[Construct]] method is called to create a new instance object and allocate memory.
2- We are not using return
keyword. new
will handle it.
3- Name of the function is capitalized so when developers see your code they can understand that they have to use new
keyword.
4- We do not use arrow function. Because the value of the this
parameter is picked up at the moment that the arrow function is created which is "window". arrow functions are lexically scoped, not dynamically. Lexically here means locally. arrow function carries its local "this" value.
5- Unlike regular functions, arrow functions can never be called with the new keyword because they do not have the [[Construct]] method. The prototype property also does not exist for arrow functions.
const me=new CreateObject("yilmaz","21")
new
invokes the function and then creates an empty object {} and then adds "name" key with the value of "name", and "age" key with the value of argument "age".
When we invoke a function, a new execution context is created with "this" and "arguments", that is why "new" has access to these arguments.
By default this inside the constructor function will point to the "window" object, but new
changes it. "this" points to the empty object {} that is created and then properties are added to newly created object. If you had any variable that defined without "this" property will no be added to the object.
function CreateObject(name,age){
this.name=name;
this.age =age;
const myJob="developer"
}
myJob property will not added to the object because there is nothing referencing to the newly created object.
const me= {name:"yilmaz",age:21} // there is no myJob key
in the beginning I said every function has "prototype" property including constructor functions. We can add methods to the prototype of the constructor, so every object that created from that function will have access to it.
CreateObject.prototype.myActions=function(){ //define something}
Now "me" object can use "myActions" method.
javascript has built-in constructor functions: Function,Boolean,Number,String..
if I create
const a = new Number(5);
console.log(a); // [Number: 5]
console.log(typeof a); // object
Anything that created by using new
has type of object. now "a" has access all of the methods that are stored inside Number.prototype. If I defined
const b = 5;
console.log(a === b);//false
a and b are 5 but a is object and b is primitive. even though b is primitive type, when it is created, javascript automatically wraps it with Number(), so b has access to all of the methods that inside Number.prototype.
Constructor function is useful when you want to create multiple similar objects with the same properties and methods. That way you will not be allocating extra memory so your code will run more efficiently.