What is the meaning of the Javascript Constructor?

Please submit your thoughts only in Javascript! I know classes and classical inheritance, but not in great detail.

As far as I know, constructors are used as prototypes for other objects. For example, I could create a car designer and provide him with objects such as hondaCivic, toyotaCamry, etc. Are there any other important things I should know about designers?

Besides,

  • What is the purpose of the constructor, besides what I have already said?
  • What are the advantages / disadvantages of the constructor?
+5
source share
3 answers

The constructor is just a normal function. This is nothing special.

All functions have the prototype property.

If you write

 var myInstance = new MyFuction(); 

JavaScript does something special with your function when it is executed.

It sets the value of this inside the function body as myInstance . In addition, it creates a link to MyFunction.prototype and saves it as an internal property of myInstance .

When your code executes, the rule to be interpreted is that if you try to access a property on myInstance that it cannot find, it will follow this link to the prototype function and look there. This forms a chain, known as a prototype chain, that extends to Object.prototype .

Here is an example:

 function Dog(name, breed) { this.name = name; this.breed = breed; //if you don't specify a return value, `this` will be returned } Dog.prototype.speak = function() { alert('Ruff, I\'m ' + this.name + ' the talking ' + this.breed); } var myDog = new Dog('buttercup', 'poodle'); myDog.speak(); 

The snippet above will open, but if you run: console.log(myDog) , you will see that it does not have a conversation method. a conversation method was found in this prototype.

This means that all Dog instances that are created will have a common speak method.

So, if I create another dog, she can also say:

 var tommysDog = new Dog('rosco', 'pitbull'); tommysDog.speak(); //tommy dog can speak too 

 function Dog(name, breed) { this.name = name; this.breed = breed; //if you don't specify a return value, `this` will be returned } Dog.prototype.speak = function() { alert('Ruff, I\'m ' + this.name + ' the talking ' + this.breed); } var myDog = new Dog('buttercup', 'poodle'); var tommysDog = new Dog('rosco', 'pitbull'); tommysDog.speak(); 

It also means that if I change the value of Dog.prototype.speak at runtime, all instances will be affected.


Note: technically, functions have a constructor property, but this is not so important, and it just bothers you if I try to explain it here.

I suggest you read mozilla docs

In addition, I suggest you read this book . You will learn a lot about the right design.


Also note that this is just one way to achieve code reuse. You do not need to go through prototypes at all. JavaScript actually has methods that allow arbitrary values ​​to assign this values ​​to functions as arguments.

This means that although my favorite lizard cannot speak normally, I can just take a method from Dog.prototype using a method like call() or apply() . (All functions have these methods because they "inherit" them from Function.prototype .)

 function Dog(name, breed) { this.name = name; this.breed = breed; //if you don't specify a return value, `this` will be returned } Dog.prototype.speak = function() { alert('Ruff, I\'m ' + this.name + ' the talking ' + this.breed); }; function Lizard(name, species) { this.name = name; this.species = species; } Lizard.prototype.speak = function() { var pretend_dog = { name: this.name, breed: this.species }; Dog.prototype.speak.call(pretend_dog); }; var myLizard = new Lizard('larry', 'chamelion'); myLizard.speak(); 
+4
source

The "constructor" in Javascript is just a function that has the special "prototype" property. Most (but not all) built-in and all user-defined functions are also constructors. When you define a function, for example

 function Car() {} 

you actually create two objects: a function and its prototype, by default it is an empty object :

enter image description here

The only difference between the constructor and the non-constructor function is that the former can be used in the new expression:

 honda = new Car() 

The new expression has three functions:

  • highlight a new shared object
  • copy the constructor prototype to this object. Internal property __proto__
  • execute the constructor body by passing the newly created object as this

This final relation to the object is as follows:

enter image description here

Constructors begin to understand when you override their default prototype , thus creating a prototype inheritance chain:

 function Vehicle() {} function Car() {} Car.prototype = new Vehicle; honda = new Car; 

Now honda inherits from Car.prototype , which in turn inherits from Vehicle.prototype :

enter image description here

+2
source
Constructors

used as prototypes for other objects.

No, they are not - if you mean "inheritance purpose" by the term "prototype".

For example, I could create a car designer and provide him with objects such as hondaCivic, toyotaCamry, etc.

Not sure what you mean. Please show the code if you have questions about this.

What is the purpose of the constructor?

No different from other languages, the purpose of the constructor is to initialize the instance.
In JS, you can invoke it using the new operator to create instances (objects).

What are the advantages / disadvantages of the constructor?

He is doing his job. Sometimes this is the wrong tool used to work.

0
source

All Articles