当从另一个原型函数发布ajax调用时，原型函数正在意外执行

Question

基本上我正在尝试创建一个管理我的表单的对象。我通过为该对象创建一个js构造函数然后创建一些对该对象执行操作的原型来完成此操作。我遇到的问题是当我执行保存原型时正在执行其他原型函数。请注意，我从来没有实际调用validate，但是没有调用它。我把这个jsFiddle放在一起，我看到的问题可以通过在validate函数中放置一个断点来识别。

https://jsfiddle.net/w4xhxpo3/15/

<input type="button" id="saveBtn" value="save"/>

var stuff = {}

$(function() {
  stuff = new Test(1, 'testName')
});

function Test(id, name)
{
  this.id = id,
  this.name = name

  this.save();
}

Test.prototype.save = function(){
  var _self = this;

  $('#saveBtn').on('click', function() {
    $.post("/echo/json/", _self)
      .done(function(){
       alert('success');
   });
 })
}  

Test.prototype.validate = function(){
 var _self = this;
}

Answer 1

此行为是有意的。

$.post()，$.get，$.ajax，...方法的数据参数被序列化为单个查询字符串，key=value对由&分隔。在内部，此序列化使用$.param()执行，文档说明：

  

从jQuery 1.3开始，使用函数的返回值而不是函数作为String。

换句话说，执行数据对象的方法，并将它们的返回值用作相应键的值。对于拥有的方法和原型链中的方法都是如此，只要它们是可枚举的。

解决方法1：Object.assign

如果仅在原型上定义方法，则可以使用Object.assign获取对象的浅表副本，该副本不包括原型成员：

$.post("/echo/json/", Object.assign({}, _self))

解决方法2：不可枚举的方法

如果方法为enumerable or not并不重要，那么请将它们设为不可枚举。然后它们将被jQuery忽略：

Object.defineProperty(Test.prototype, 'validate', {
    enumerable: false,
    value: function() {
        var _self = this;
    }
});

您需要对save方法执行相同的操作，否则也会被调用（再次！）。