在构造函数中声明 javascript 对象方法与在原型中声明 javascript 对象方法

2022-08-30 02:26:28

在创建javascript对象时,我可以将方法声明放在构造函数或原型中。例如,假设我想要一个具有 Name 属性和 Bark 方法的 Dog 类。我可以将 Bark 方法的声明放入构造函数中:

var Dog = function(name) {
    this.Name = name;
    this.Bark = function() {
        alert(this.Name + " bark");
    };
}

或者我可以作为原型对象的方法:

var Dog = function(name) {
    this.Name = name;
}

Dog.prototype.Bark = function() {
    alert(this.Name + " bark");
};

当我实例化 Dog 类型的对象时,这两种方法似乎都可以正常工作:

var dog = new Dog("Fido");
dog.Bark();  //Both approaches show "Fido bark"

我应该更喜欢这些方法中的一种而不是另一种方法吗?使用一个比另一个有什么好处吗?在幕后,这两种方法最终会做同样的事情吗?大多数人倾向于哪种方法?

感谢您的帮助。


答案 1

对于您给出的示例,应使用原型方法。一般来说,这要视情况而定。第一种方法(初始化构造函数中的方法)的主要优点是,可以通过在方法中使用构造函数中定义的局部变量来利用闭包。这些变量不能在构造函数外部直接访问,因此实际上是“私有的”,这意味着您的API比将这些变量定义为对象的属性更清晰。一些一般的经验法则:

  • 如果您的方法不使用构造函数中定义的局部变量(您的示例不使用),请使用原型方法。
  • 如果要创建大量 s,请使用原型方法。这样,所有“实例”(即由构造函数创建的对象)将共享一组函数,而构造函数的方式是,每次调用构造函数时都会创建一组新的函数,从而使用更多的内存。DogDogDog
  • 如果您正在创建少量的 s,并且发现在构造函数中使用局部“私有”变量可以改进代码,则这可能是更好的方法。使用您的判断,如果性能或内存消耗是主要问题,请进行一些基准测试。Dog

可以使用混合方法,其中仅在构造函数中定义需要访问局部私有构造函数变量的方法,而将其他方法分配给原型。

例如,下面的代码在构造函数中使用局部变量来跟踪这只狗吠叫的次数,同时保持实际数字的私密性,因此与吠叫相关的方法在构造函数中定义。尾巴摆动不需要访问树皮的数量,因此可以在原型上定义该方法。

var Dog = function(name) {
    this.name = name;

    var barkCount = 0;

    this.bark = function() {
        barkCount++;
        alert(this.name + " bark");
    };

    this.getBarkCount = function() {
        alert(this.name + " has barked " + barkCount + " times");
    };
};

Dog.prototype.wagTail = function() {
    alert(this.name + " wagging tail");
};

var dog = new Dog("Dave");
dog.bark();
dog.bark();
dog.getBarkCount();
dog.wagTail();

答案 2

两者是不同的:第一个解决方案将仅将对方法的引用存储在原型对象上,而第二个解决方案将方法存储在每个对象上。这意味着每个对象将包含一个额外的指针,因此每个对象都会占用更多的内存。

每个对象方法允许该方法引用构造函数(闭包)中的变量,因此它允许您访问一些无法从原型方法访问的数据。

最后,可以在以后更改原型方法,即您可以在运行时在原型对象上重新定义,并且此更改将适用于具有此原型的所有对象(因为该方法始终通过原型查找)。Bark