javascript - 如何从构造函数返回数组并在 Javascript 中成功链接对象

Question

我一直在浏览 jQuery 代码，并且看到了一些有此问题的链接。我再次问这个问题是因为我不太理解其中的任何一个，所以请不要将此问题标记为重复。我浏览了以下 stackoverflow 链接:

How can jQuery return an array and still have it to be a jQuery object

How does jQuery chaining work

How does jQuery return an array of the selected objects

浏览了所有这些链接，我不明白它是如何工作的。我所要求的只是一个非常简单的示例，从构造函数对象返回一个数组并仍然链接它。我尝试过以下代码:

(function(window, document, undefined)
{
    var lhd = function(selector)
    {
        return new Lhd(selector);
    }

    function Lhd(selector)
    {
        var elem = document.querySelectorAll(selector),
            elems = {};

        return this.makeArray(elems, elem);
    }

    Lhd.prototype = {
        makeArray: function(arr, result)
        {
            var ret = result || [];

            Array.prototype.push.apply(ret, arr);

            return ret;
        },

        click: function()
        {
            console.log('click');

            return this;
        }
    };

    window.lhd = lhd;
})(window, document);

我能够返回一个数组，但无法链接它。

Answer 1

I'm able to return an array

您不能返回数组，您必须使新实例 (this) 变得类似数组。

function lhd(selector) {
    return new Lhd(selector);
}

function Lhd(selector) {
    var elems = document.querySelectorAll(selector);

    this.length = 0; // initialise a length
    Array.prototype.push.apply(this, elems); // push onto the instance

    // don't `return` anything - it's a constructor
}

Lhd.prototype.click = function() {
    console.log('click');
    return this;
};

您现在可以像 lhd('a').click().click() 一样使用它。