通过AJAX发送数据时调用对象的函数

Question

通过AJAX请求发送具有功能的普通javascript对象会导致调用此功能。 为什么会这样呢？ 发送JSON数据时不会发生此问题。 将对象转换为JSON的最佳方法是什么？

我附上了演示此行为的示例代码。

var A = (function () {
    function A(value) {
        this.value = value;
    }
    A.prototype.getValue = function () {
        console.log('getValue');
        return this.value;
    };
    return A;
})();

$(document).ready(function () {
    var a = new A(10);

    var xhr = $.ajax("http://example.com/", {
        data: a,
        type: 'post',
        error: function (data) {
            console.log('error');
        },
        success: function (data) {
            console.log('success');
        },
        crossDomain: true
    });
}

代码输出为：

getValue
success 

Answer 1

这是因为jQuery.param （由jQuery.ajax内部使用）在序列化请求参数时使用函数的返回值 。 从文档：

从jQuery 1.3开始，使用函数的返回值代替函数作为字符串。

因此，当jQuery.param遇到您a对象并看到getValue属性是一个函数时，它将调用该函数并使用（序列化的）返回值。

无论哪种方式，为什么要传递诸如请求数据之类的复杂对象？ 如果您不希望将该函数与请求数据一起传递，则最好为您的A类创建一个自定义序列化函数，例如：

A.prototype.serialize = function() {
    return { value: this.value };
}

并改用它：

var xhr = $.ajax("http://example.com/", {
    data: a.serialize(),
    // ...
});