在构造函数中定义原型方法

IT技术 javascript prototype-programming
2021-03-14 08:15:28

今天，我看到了我这辈子从未见过的 JavaScript 模式。我无法说出使用这种模式的目的。这对我来说似乎是错误的，但我想保守一点。这可能是我以前从未见过的一些很棒的模式。

function Dog() {
    Dog.prototype.bark = function () {
        alert('woof!');
    }

    this.bark = function () {
        Dog.prototype.bark();
    }

    this.bark();
}

首先，我不喜欢无缘无故地在构造函数中创建方法（作为特权成员）。每次创建实例时都会导致创建函数。其次，在这个代码片段中，它还调用了原型名称“Dog”，而不是“this”。这让我超级困惑。

有谁知道它有什么好处？

谢谢！优雅

2个回答

这是一个非常糟糕的主意，原因有很多。其中一些是：

  1. 在构造函数中向原型添加方法将导致所有实例的原型方法被替换，每次实例化一个新的 Dog 时。
  2. 调用Dog.prototype.bark()意味着这this将是Dog.prototype而不是您的 实例Dog，这可能会导致严重的问题。
  3. this.bark = function () { Dog.prototype.bark(); }是一些严重的WTF。因为this.bark已经对原型方法进行了评估，因此没有必要。this正如#2 中提到的那样，这样称呼它实际上破坏了自然value。

这是应该的：

function Dog() {
  this.makeSound();
};

Dog.prototype.bark = function() {
  alert('woof');
};

Dog.prototype.makeSound = function() {
  this.bark();
};

或者，根本没有原型：

function Dog() {
  this.bark = function() {
    alert('woof');
  };

  this.makeSound = function() {
    this.bark();
  };

  this.makeSound();
};

我根本不会相信你的这个片段。

#2：即使 bark 在构造函数之外初始化也是一样的 - 方法的this是由调用设置的。#3：与 #2 相同（这将是Dog.prototype），但函数不使用它，因此在这种情况下不会导致问题。
2021-04-24 08:15:28
你为什么要做this.makeSound = function() { }？这个例子可能会在没有澄清的情况下产生误导。这不会在原型对象上设置，并且该函数在内存中为new Dog();. 最好Dog.prototype.makeSound = function () {}
2021-05-07 08:15:28

很抱歉回复很晚，但如果您真的想在构造函数中添加原型并且在创建新实例时不重新创建它，您可以这样做：

function Dog() {
    if (!Dog.prototype.bark) {
        Dog.prototype = function() {
            console.log('woof');
        }
    }

    this.bark();
}

我仍然可能不会使用这种方法，但我有一些实例，在处理 3rd 方框架（狡猾的那种）时，这种方法是一种选择。

其它你可能感兴趣的问题
上一篇如何在 Firebase 表上进行连接 下一篇悬停时更改图像