10、JavaScript链式调用与工厂模式解析

JavaScript链式调用与工厂模式解析

链式调用结构

在JavaScript中，我们对美元函数（ $ ）并不陌生，它通常会返回一个HTML元素或元素集合。以下是其原始实现：

function $() {
    var elements = [];
    for (var i = 0, len = arguments.length; i < len; ++i) {
        var element = arguments[i];
        if (typeof element === 'string') {
            element = document.getElementById(element);
        }
        if (arguments.length === 1) {
            return element;
        }
        elements.push(element);
    }
    return elements;
}

若要让它支持链式调用，我们需要将其改造为构造函数，把元素作为数组存储在实例属性中，并在所有原型方法中返回实例的引用。以下是改造后的代码：

(function() {
    // 使用私有类
    function _$(els) {
        this.elements = [];
        for (var i = 0, len =