Javascript构造函数的要点是什么? [英] What is the point of Javascript Constructor?

查看:119
本文介绍了Javascript构造函数的要点是什么?的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

请提供您对于Javascript的想法!我知道类和经典继承,但不是很详细。



据我所知,构造函数被用作其他对象的原型。例如,我可以创建一个汽车构造函数,并给它的对象,如hondaCivic,toyotaCamry等。有什么其他重要的事情我应该知道的构造函数?




  1. 除了我已经说明的之外,构造函数的用途是什么?

  2. 构造函数是一个构造函数的好处/缺点?





所有函数都有一个名为 prototype 的属性。



如果你写

  var myInstance = new MyFuction 

JavaScript会在执行函数时执行特殊的操作。



它将函数体内的 this 的值设置为 myInstance
此外,它创建对 MyFunction.prototype 的引用,并将其存储为 myInstance 的内部属性。



执行代码时,解释器遵循的规则是,如果您尝试访问 myInstance ,它找不到,它会遵循函数的原型的引用,看看那里。这形成一个链,称为原型链,一直引导到 Object.prototype



示例:



  function Dog(name,breed){this.name = name; this.breed =繁殖; //如果不指定返回值,将返回`this`} Dog.prototype.speak = function(){alert('Ruff,I \'m'+ this.name +'the talking' this.breed);} var myDog = new Dog('buttercup','poodle'); myDog.speak();  

/ p>

上面的代码段可以工作,但如果你运行: console.log(myDog)没有说话的方法。在它的原型中发现了speak方法。



这意味着创建的 Dog 的所有实例都将共享相同的 speak 方法。



所以,如果我创建另一只狗,它也能说:

 code> var tommysDog = new Dog('rosco','pitbull'); 
tommysDog.speak(); // tommy的狗可以说太多

 function 名称,品种){this.name = name; this.breed =繁殖; //如果不指定返回值,将返回`this`} 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();  



在运行时 Dog.prototype.speak 的值,所有实例都将受到影响。

技术上,函数有一个构造函数。






属性,但不是 重要,它只会混淆你更多,如果我在这里解释它。



我建议您阅读 mozilla docs



此外,我建议您阅读这本书。你会学到很多关于正确的设计。






另请注意,这只是实现代码重用的一种方法。你不必经历原型。事实上,JavaScript有一些方法可以提供任意值,因为 this 可以作为参数。



这意味着,即使我的宠物蜥蜴不能正常说话,我可以借用 Dog.prototype 的方法,使用 call() apply( ) 。 (所有函数都有这些方法,因为它们从 Function.prototype 继承它们。)



  function Dog(name,breed){this.name = name; this.breed =繁殖; //如果不指定返回值,将返回`this`} 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();  

div>


Please provide your thoughts with respect to Javascript only! I am aware of classes and classical inheritance but not at a great detail.

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

Furthermore,

  1. What is the purpose of a constructor, apart from what I have already stated?
  2. What are the benefits / disadvantages of a constructor?

解决方案

A constructor is just a normal function. There is nothing special about it inherently.

All functions have a property called prototype.

If you write

var myInstance = new MyFuction();

JavaScript does something special with your function when it executes it.

It sets the value of this inside the function body to be myInstance. Additionally, it creates a reference to MyFunction.prototype and stores it as an internal property of myInstance.

When your code is executing, the rule that the interpreter follows is such that, if you try to access a property on myInstance that it can't find, it will follow that reference to the function's prototype and look there. This forms a chain, known as the prototype chain that leads all the way up to Object.prototype.

Here's 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 works, but if you run: console.log(myDog) you'll see that it does not have a speak method. the speak method was found in it's prototype.

This means that all 'instances' of Dog that are created will all share the same speak method.

So, If I create another dog, it will be able to speak aswell:

var tommysDog = new Dog('rosco', 'pitbull');
tommysDog.speak(); //tommy's 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 run time, all instances will be affected.


Note: technically, functions do have a constructor property but it's not that important and it would just confuse you more if I tried to explain it here.

I suggest you read the mozilla docs

Additionally, I suggest you read this book. You'll learn a lot about proper design.


Also note that this is just one way to achieve code re-use. You don't have to go through prototypes at all. In fact JavaScript has methods that let you supply arbitrary values as the value of this to functions as an argument.

This means that, even though my pet lizard can't normally speak, I can just borrow the method from Dog.prototype by utilizing 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();

这篇关于Javascript构造函数的要点是什么?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆