Javascript - 原型继承问题和可能的一般理解问题

Question

我开始学习 JavaScript，在使用了多年但并不真正了解发生了什么之后，我决定是时候对此做点什么了。此外，我还从事一个可以使用 JavaScript 来编写应用程序脚本的项目。

所以，说了这么多，我的问题与原型继承有关，我认为我现在知道它是如何工作的，但可能存在问题。基本思想是每个对象（好吧，不是每个对象 - 是的;-)）都有一个原型，如果实际对象无法处理它，直到到达原型链的末尾（一个原型的原型），所有请求都会被委托给该原型。对象也可以有原型，对吧？）。

在我的应用程序中，将会发生大规模过滤，我想为用户提供一种链接简单过滤器命令的方法（这不是非常技术性的，它应该尽可能简单），从而通过每个附加调用缩小结果集。我是什么意思？史密斯。像这样：

zoo.getAnimals().getAnimalsWithFurColor("red").getMammals()

zoo 始终在范围内，并且是一个包含动物和动物园其他属性的对象。因此，我希望示例中的所有方法调用都会返回一个像这样的对象（我们将其称为 Container）：

 {
   data: [harryTheElephant, sallyThePenguin, timTheWoodpecker],
   someFilterMethod: function() {
        return new Container(data.filter(function(animal) {
            return animal.someProperty == someValue;
        });
   }
 }

到目前为止，一切都很好。但我也希望动物园成为一个容器。这就是我真正的问题发挥作用的地方：由于动物园必须做一些非常昂贵的事情来检索起始动物组，我想延迟加载它们。当动物园获得 getAnimals() 请求获取数据。

我的想法是将动物园的原型设置为一个从动物园获取数据的容器。但我找不到从原型（容器）访问动物园的 getAnimals() 方法的方法。我用 this 尝试过，但找不到该方法。

有什么想法如何编写可以完成我想做的事情的代码吗？请注意，我不在浏览器环境中，我在我的应用程序中嵌入了 JavaScript (1.7)。

谢谢！

Answer 1

对于一个对象来说，访问（原型地）从它继承的东西的属性没有多大意义。例如，如果 Cat 有一个 meow() 方法，那么 Mammal 引用 meow() 会很奇怪>。同样，如果 Zoo 是从 Container 派生的，那么 Container 引用 getAnimals() 会很奇怪。

我的建议是，要完成延迟加载，请将一个返回数组的访问器函数传递给Container构造函数，而不是直接传递数组。这可能看起来像：

function Container(getAnimals) {
    this.someFilterMethod = function () {
        return new Container(function () {
            return getAnimals().filter(function (animal) {
                 return animal.someProperty === someValue;
            });
        });
    };

    this.get = getAnimals;
}

function makeZoo(animals) {
    var zoo = Object.create(new Container(function () { return animals; }));
    zoo.customZooMethod = function () { /* ... */ };

    return zoo;
}

var aZoo = makeZoo([harryTheElephant, sallyThePenguin, timTheWoodpecker]);
var filteredAnimals = aZoo.someFilterMethod().get();

Answer 2

对象继承自其内部原型，而不是其公共原型。

要实现链接，只需让每个方法返回实例即可。

例如

function Foo(firstName, lastName) {
  this.firstName = firstName;
  this.lastName = lastName;
} 

Foo.prototype.sayFirstName = function() {
  alert(this.firstName);
  return this;
}

Foo.prototype.sayLastName = function() {
  alert(this.lastName);
  return this;
}

var foo = new Foo('Foo', 'Bar');

foo.sayFirstName().sayLastName();

，但是，链接并不是一个好主意，因为它使调试变得困难。如果您将一堆命令链接在一起并放在一个语句或表达式中并且失败了，您如何找出哪一个失败了？

编辑

您可能想做类似的事情：

// Container constructor
function Container(dataArray) {
  this.data = dataArray;
}

// Filter data and return new container
Container.prototype.getAnimalsWithFurColor = function(color) {
  var filteredArray = [];

  for (var i=0, iLen=this.data.length; i<iLen; i++) {

    // Presuming the items (animals?) in data have a getColor methed 
    if (this.data[i].getColor() == color) {
      filteredArray.push(this.data[i]);
    }
  }
  return new Container(filteredArray);
}