Question

可能重复：
Understanding prototypal inheritance in JavaScript

好的，所以我对JS中的OOP概念有些新意。

下面写的这两段代码之间有什么区别：

function animal(){
    this.name = 'rover';
    this.set_name = function(name){
         this.name = name;
    }
}

function animal(){
    this.name = 'rover';
}
animal.prototype.set_name = function(name){
    this.name = name;
}

他们都做同样的事情，那有什么区别？

Answer 1

使用原型可以更快地创建对象，因为每次创建新对象时都不必重新创建该函数。

执行此操作时：

function animal(){
    this.name = 'rover';
    this.set_name = function(name){
         this.name = name;
    }
}

每次创建动物时都会创建 de novo set_name功能。但是当你这样做时

animal.prototype.set_name = function(name){
    this.name = name;
}

每次都不需要重新创建该功能;它存在于原型的一个地方。因此，当您致电someAnimal.set_name("Ubu");时，this上下文将设置为someAnimal，并且将调用（唯一的）set_name函数。

使用第一种语法有一个好处：以这种方式创建的函数可以访问私有数据：

function animal(){
    var privateData = 'foo'

    this.name = 'rover';
    this.set_name = function(name){
         this.name = name;
         alert(privateData); //will alert 'foo'
    }
}

道格拉斯·克罗克福德（Douglas Crockford）称这样创建的函数是“特权”的原因：他们可以访问公共数据和私有数据。

Answer 2

从这些功能

创建新对象时会出现差异

var animal1 = new animal();

第一个函数创建的所有对象将具有不同的name和set_name属性。但是，第二个函数创建的所有对象将共享set_name属性。

Answer 3

在第一个示例中，每个单独的动物都有自己的set_name函数属性，而在第二个示例中，它们通过原型共享相同的函数。

第一个版本的优点是方法可以访问构造函数内声明的本地（私有）变量。

第二种方法的优点是它需要更少的内存（因为你只存储一次而不是一百万次），并且在当前的JS引擎中更具性能。

使用第二种方法，您还可以以同样影响已创建实例的方式修改或添加方法。

原型的目的是什么？

3 个答案: