Question

我想要一个主js文件，其中包含一个resize函数和特定文件，可以在不更改主文件和手动调用函数的情况下将工作量添加到主文件中。

假设我有一个对象文字

var App = {
  resize: function(){
    // Code should be executed here
  },
  addResize: function(){
    // ?
  }
}

我想要一个函数来向resize函数添加代码，该函数动态地将工作量添加到resize函数（在窗口调整大小时调用）：

App.addResize(function(){ ... });

我想到的第一件事就是将来自addResize的匿名函数存储到数组中并在resize函数中迭代它，但这并不像是在做最佳实践：

var App = {
  resizeFunctions = [];
  resize: function(){
    // iterate over resizeFunctions and call each one
    // here I define throttling/debouncing ONCE
  },
  addResize: function(fn){
    this.resizeFunctions.push(fn);
  }
}

window.onresize = App.resize();

App.addResize(fn1);
App.addResize(fn2);

有更好的方法吗？

Answer 1

因为你指的是一个功能，即。一个resize函数，我假设你正在寻找函数重载：

Function overloading in Javascript - Best practices
http://ejohn.org/blog/javascript-method-overloading/

如果要将一组与单个父对象相关的方法的功能扩展到不同的子对象中，我会研究原型继承。
它允许您为每个子对象定义重新定义父方法。

Answer 2

您可以将对象文字视为数组。

App["resize"] = function(){
  //Code goes here
}

__

或者

App.resize = function(){
//Code here
}

两者都同样好。这些将更新resize

的定义

如果你想添加一些新方法，那么语法也一样。

App["myNewMethod"] = new function(){
 //Code here
}

OP评论后编辑

var oldFun = App["resize"];   // or may be store this in App itself
App["resize"] = function(){
    //Pre-processing 

    // Now call original resize method
    oldFun();   //If resize method used method argument then use oldFun.apply( this, arguments );


    //Post processing 
}

Answer 3

您想覆盖现有功能吗？然后你可以这样做：

App.addResize = function(){}

Answer 4

App.addResize(function(){ ... });

会将函数传递给addResize作为属性，但不会将其添加到该属性中。你可以做到

App.addResize.newFunction = function(){ ... };

其中newFunction是函数的名称

在JavaScript中向函数添加函数的最佳实践是什么？

4 个答案: