对象文字内部的覆盖函数

Question

我有以下对象文字：

var timeObject = {
    type: "double",
    grid: true,
    values: [
        //
    ],
    from_min: 0,
    to: 8,
    onChange: function(data) {
        console.log(data);
    }
};

该对象将传递到不同的位置：

$("#sundayTime").ionRangeSlider(timeObject);
$("#tuesdayTime").ionRangeSlider(timeObject);
$("#wednesdayTime").ionRangeSlider(timeObject);
$("#thursdayTime").ionRangeSlider(timeObject);
$("#fridayTime").ionRangeSlider(timeObject);
$("#saturdayTime").ionRangeSlider(timeObject);

现在，我想将默认行为（在控制台中记录数据）更改为我的自定义逻辑。

我知道我们可以使用这种技术来实现对象文字继承：

function extend(proto, literal) {
    var result = Object.create(proto);
    Object.keys(literal).forEach(function(key) {
        result[key] = literal[key];
    });
    return result;
}

对于使用它，我们有：

$("#thursdayTime").ionRangeSlider(extend(timeObject, {
    onChange: function (data) {
        console.log('thursdayTime');
    }
}));

$("#fridayTime").ionRangeSlider(extend(timeObject, {
    onChange: function (data) {
        console.log('fridayTime');
    }
}));

但我想知道是否有更简单的方法可以做到这一点

提前致谢

Answer 1

如果您使用的是ES2015，则可以：

Object.assign({}, timeObject, {
  onChange: function(data) {
    console.log('whooof');
  } 
})

Answer 2

您可以使用真实继承，而不是将所有属性复制到新对象。

Object.assign(Object.create(timeObject), {
  onChange: function(data) {
    console.log('whooof');
  } 
});

Answer 3

我不确定性能，可以编写返回该对象文字的函数：

function getConfig (onChange) {
  return timeObject = {
    type: "double",
    grid: true,
    values: [
        //
    ],
    from_min: 0,
    to: 8,
    onChange: onChange
  };
}

$("#fridayTime").ionRangeSlider(getConfig(function (data) {
  console.log('I am friday data:', data)
}));

如果所有天数（或多或少）相等，则可以简化以下逻辑：

function getConfig (day) {
  return timeObject = {
    type: "double",
    grid: true,
    values: [
        //
    ],
    from_min: 0,
    to: 8,
    onChange: function (data) {
      console.log('I am', day, 'data:', data)
    }
  };
}

$("#fridayTime").ionRangeSlider(getConfig('friday'));

Answer 4

我认为除了使用另一个库的方法（如建议的那样）或添加像这样的附加包装函数之外，没有什么比其他更短的（如果更短更容易）。

function eto(obj, onChangeFn){
    return extend(obj, {
        onChange: onChangeFn
    });
}

$("#thursdayTime").ionRangeSlider(eto(timeObject, function(data){
    console.log('thursdayTime');
}));