Question

你肯定见过jquery。你知道jquery允许你链接这样的方法：

$('.elements').css({color:'red'}).etc().etc()...

但是如果你注意到，那个函数会返回一个对象数组（？）：

$(document).ready(function(){
  var $elements = $('.c').css({color:'red'});
  console.log($elements);
});

（Example, see console to see the result）

同样$函数也可以：

$(document).ready(function(){
  var $elements = $('.c');
  console.log($elements);
});

（Example, see console to see the result）

两者都返回一个数组，然后可以继续链接。怎么可能？为什么在不返回this（或对象本身）时会继续链接？

我读了this post并且他可以成功地添加加号，但这是一个现有的字符串，因为他原则是字符串对象。

有什么办法可以存档吗？

更新

我知道它返回一个jquery对象，但是如何返回包含值数组的对象并继续链接返回的值。

更新2

我要存档的内容

我有这个类，我想要一个方法来返回我的对象的数组，无论何时链接它

var elements = Enumerable(anArray).Where(function(elements){ return elements != 1 })

这里的链接结束了所以它必须返回满足条件的元素，但我想保持chaingin我只需要这样做：

elements  = elements.Where(function(elements){ return elements == 1}).Take(3);

并按照我的意愿继续保持链接。

Answer 1

$不返回数组，它返回jQuery object，这是一个类似数组的对象。即它的一些属性具有数字名称，并且具有length属性。

示例：

var obj = {
    0: element1,
    1: element2,
    find: function() {
        // some logic
        return this; // return a reference to itself for chaining
    },
    length: 2
};

现在，jQuery方法不返回this，它返回一个新的jQuery对象，它暴露了相同的接口（显然），因此允许链接。

如果你想自己实现链接，你必须这样做：返回this或对象的新实例，并用当前对象拥有的数据初始化它。

示例：

function Constr(data) {
    this.data = data || {};
}

Contr.prototype.chain = function() {
    // do stuff
    console.log(this.data);
    return new Constr(this.data);
    // or return this;
};

var obj = new Constr({foo: 'bar'});
obj.chain().chain().chain();

Answer 2

jquery对象实际上是html对象的集合，所以当一个函数返回一个jquery对象时，它实际上返回了多个元素。

var ChainableObject = {
    data: [],
    where: function(fn){
       //doStuff with this.data
       return this;
    },
    take: function(n){
       //doStuff with this.data
       return this;
    },
    // and so on
    //.........
}

如何制作链接方法但同时返回3个以上的值

2 个答案: