jQuery使用相同的函数扩展多个对象

jQuery extend multiple objects with the same function

本文关键字：扩展 对象 函数 jQuery      更新时间：2023-09-26

所以我使用$.extend来组合多个组件（对象）。这些组件中的一些具有相同键的功能。我希望最终的扩展对象具有相同的键，但要使它指向一个函数，该函数一个接一个地调用所有合并组件的函数版本。

所以它看起来像这样：

var a = { foo: function() { console.log("a"); } };
var b = { foo: function() { console.log("b"); } };
var c = {}; // Doesn't have foo
var d = $.extend({}, a, b, c);
var e = $.extend({}, a, c);
var f = $.extend({}, c);
d.foo(); // Should call function() { console.log("a"); console.log("b"); }
e.foo(); // Should call function() { console.log("a"); }
f.foo(); // Should call function() {}

有务实的方法吗？我只想对一组特定的键执行此操作，所以我只想将这些特定键的函数合并在一起，并让extend中的排序覆盖其他任何内容。

希望这是有意义的：S

注意

f.foo(); // Should call function() {}

对象CCD_ 1似乎不具有属性CCD_。调用CCD_ 3返回CCD_。不确定是要求将foo函数添加到扩展的f对象，还是从匿名函数返回对象c（空对象）？在下面的文章中，foo函数而不是添加到扩展的f对象中。

jquery c0用于在$.each() 添加具有foo属性的函数

尝试

var a = { foo: function() { console.log("a"); } };
var b = { foo: function() { console.log("b"); } };
var c = {}; // Doesn't have foo
//d.foo(); 
// Should call function() { console.log("a"); console.log("b"); }
//e.foo(); 
// Should call function() { console.log("a"); }
//f.foo(); 
// Should call function() {}
var callbacks = $.Callbacks();
var arr = [], d, e, f;
$.each([a,b,c], function(k, v, j) {
  var j = [a,b,c];
  // filter objects having `foo` property
  if (v.hasOwnProperty("foo")) {
    arr.push([v, v.foo]);
    if (arr.length > 1) {
       callbacks.add(arr[0][1], arr[1][1]);
       // `add` `foo` properties to `callbacks`
       // `fire` both `callbacks` when `object.foo` called
       j[k -1].foo = callbacks.fire;
       d = $.extend({}, j[k - 1])
    } else {
       // `else` extend original data (`fn`, `object`) 
       // contained within object 
       e = $.extend({}, j[k + 1]);
       f = $.extend({}, j[++k + 1]);
    }
  }  
});
d.foo(); // `a` , `b`
e.foo(); // `b`
console.log(f); // `Object {}`
f.foo() // `TypeError: undefined is not a function`

jsfiddlehttp://jsfiddle.net/guest271314/3k35buc1/

请参阅jQuery.Callbacks（）

以下是我根据猜测271314的答案得出的结论。toMix是要混合到对象中的组件数组。实际上，我并不需要我认为可能需要的伪函数，最终我使用了一个函数数组，而不是$.Callbacks（），这样我就可以控制调用函数的顺序。我还需要使用call（）函数，以便可以从正确的this对象调用这些函数。

this.functionMerge = function(toMix) {
  var callbacks = {};
  var functions = {};
  var obj = {};
  var keys = [
    'componentWillMount',
    'componentDidMount',
    'componentWillUpdate',
    'componentDidUpdate',
    'componentWillUnmount'
  ]
  $.each(keys, function(key, value) {
    callbacks[value] = [];
  });
  for (i = 0; i < toMix.length; ++i) {
    $.each(keys, function(key, value) {
      if (toMix[i].hasOwnProperty(value) && typeof toMix[i][value] == 'function') {
        callbacks[value].push(toMix[i][value]);
      }
    });
    $.extend(true, obj, toMix[i]);
  }
  $.each(keys, function(key, value) {
    functions[value] = function() {
      var that = this;
      $.each(callbacks[value], function(key, value) {
        value.call(that);
      });
    };
  });
  return $.extend(true, obj, functions);
}
相关文章：