Question

请在javascript中考虑此代码：

function Selector() {
    this.Status = "";
    this.Groups = new Array();
    this.Errors = new Array();
}

我想为Selector类的Groups属性添加一个方法，并将其用于任何实例。我怎么能这样做？

请注意我写这段代码：

function Selector() {
    this.Status = "";
    this.Groups = []; 
    this.Groups.myFunction = function(){alert(this.length);  
    };
    this.Errors = [];
}

var selector = new Selector();
selector.Groups = [1,2,3];
selector.Groups.myFunction();

但是当我设置Group属性时，我收到调用方法的错误：

错误：selector.Groups.myFunction不是函数

我更喜欢使用原型对象找到一种方法。

感谢。

Answer 1

您的代码将无法以这种方式工作，因为在构造函数中，您将对象（数组）分配给类属性并扩展该特定实例。然后，当您分配新数组时，新创建的数组没有这样的方法。因此，您的解决方案可以通过以下方式进行更改：

function Selector() {
    this.Status = "";
    this.setGroups([]);
    this.Errors = [];
}

Selector.prototype.myFunction = function() {
    alert(this.length);
};

Selector.prototype.setGroups = function(groups) {
    this.Groups = groups;
    this.Groups.myFunction = this.myFunction;
};

var selector = new Selector();
selector.Groups.myFunction();
selector.setGroups([1,2,3]);
selector.Groups.myFunction();
selector.setGroups(['foo', 'bar']);
selector.Groups.myFunction();

DEMO

但我不建议你使用这种做法。更好的是创建一个类GroupCollection并将数组封装为其属性：

function GroupCollection(items) {
    this.items = items || [];
}

GroupCollection.prototype.myFunction = function() {
    alert(this.items.length);
};

function Selector() {
    this.Status = "";
    this.Groups = new GroupCollection();
    this.Errors = [];
}

Selector.prototype.setGroups = function(groups) {
    this.Groups.items = groups;
};

var selector = new Selector();
selector.Groups.myFunction();
selector.setGroups([1,2,3]);
selector.Groups.myFunction();
selector.setGroups(['foo', 'bar']);
selector.Groups.myFunction();

DEMO

Answer 2

当你说：

  selector.Groups = [1,2,3];
  selector.Groups.myFunction();

您实际上正在初始化一个新数组并将其存储在selector.Groups属性中，并且由于Array对象没有名为myFunction的方法，因此会出错。

您可以扩展Array对象，以便每个数组都有一个myFunction方法，如下所示：

  Array.prototype.myFunction = function() { alert(this.length) };

这不是一个好主意imo，但是你没有留下很多选项，因为继承数组不会在IE中保持length属性:(

有关iframe hack to Array子类化的信息，请参阅this link。

如何在javascript中创建数组的方法作为对象的属性？

2 个答案: