javascript - jQuery $ (':input' ).serializeArray();使用 native API 的功能

Question

我如何只使用 JavaScript 编写这个 jQuery 函数(或者更确切地说，产生相同的结果)？

$(':input').serializeArray();

Function docs .

Answer 1

看jQuery's implementation :

function serializeArray() {
    return this.map(function () {
        // Can add propHook for "elements" to filter or add form elements
        var elements = jQuery.prop(this, "elements");
        return elements ? jQuery.makeArray(elements) : this;
    }).filter(function () {
        var type = this.type;
        // Use .is(":disabled") so that fieldset[disabled] works
        return this.name && !jQuery(this).is(":disabled") && rsubmittable.test(this.nodeName) && !rsubmitterTypes.test(type) && (this.checked || !manipulation_rcheckableType.test(type));
    }).map(function (i, elem) {
        var val = jQuery(this).val();

        return val == null ? null : jQuery.isArray(val) ? jQuery.map(val, function (val) {
            return {
                name: elem.name,
                value: val.replace(rCRLF, "\r\n")
            };
        }) : {
            name: elem.name,
            value: val.replace(rCRLF, "\r\n")
        };
    }).get();
}

当然，这假定 this 是一个 jQuery 对象，具有 .filter() 和 .map() 等方法。这些方法也可用于 ECMAScript 5 中的数组，因此如果您不需要支持 IE < 9，此代码可能适用于 this 是 HTMLElements 数组的情况——在删除或重写极端情况之后jQuery 处理。如果您需要支持旧浏览器，那么您可能应该只使用 jQuery。