blocks|key|1687907|text|谢谢大家，proxy模式真的很helped.....Actually，我想调用一个全局函数foo..在某些页面，我需要做一些检查。因此，我做了以下工作。|type|unstyled|depth|inlineStyleRanges|entityRanges|data|1687908|//Saving+the+original+func
var+org_foo+=+window.foo;

//Assigning+proxy+fucnc
window.foo+=+function(args){
++++//Performing+checks
++++if(checkCondition(args)){
++++++++//Calling+original+funcs
++++++++org_foo(args);
++++}
};|code-block|syntax|javascript|1687909|这真的帮了我大忙|1687910|entityMap^0|0|0|0^^$0|@$1|2|3|4|5|6|7|K|8|@]|9|@]|A|$]]|$1|B|3|C|5|D|7|L|8|@]|9|@]|A|$E|F]]|$1|G|3|H|5|6|7|M|8|@]|9|@]|A|$]]|$1|I|3|-4|5|6|7|N|8|@]|9|@]|A|$]]]|J|$]]

Thanks guys the proxy pattern really helped.....Actually I wanted to call a global function foo.. 
In certain pages i need do to some checks. So I did the following.

<pre><code>//Saving the original func
var org_foo = window.foo;

//Assigning proxy fucnc
window.foo = function(args){
 //Performing checks
 if(checkCondition(args)){
 //Calling original funcs
 org_foo(args);
 }
};
</code></pre>

Thnx this really helped me out

blocks|key|1687942|text|您可以使用如下结构覆盖函数：|type|unstyled|depth|inlineStyleRanges|entityRanges|data|1687943|function+override(f,+g)+{
++++return+function()+{
++++++++return+g(f);
++++};
}|code-block|syntax|javascript|1687944|例如：|1687945|+a+=+override(a,+function(original_a)+{
++++++if+(condition)+{+new_code();+original_a();+}
++++++else+{+original_a();+other_new_code();+}
+});|1687946|编辑:修复了一个打字错误。|1687947|entityMap^0|0|0|0|0|0^^$0|@$1|2|3|4|5|6|7|O|8|@]|9|@]|A|$]]|$1|B|3|C|5|D|7|P|8|@]|9|@]|A|$E|F]]|$1|G|3|H|5|6|7|Q|8|@]|9|@]|A|$]]|$1|I|3|J|5|D|7|R|8|@]|9|@]|A|$E|F]]|$1|K|3|L|5|6|7|S|8|@]|9|@]|A|$]]|$1|M|3|-4|5|6|7|T|8|@]|9|@]|A|$]]]|N|$]]

You can override a function using a construct like:

<pre><code>function override(f, g) {
 return function() {
 return g(f);
 };
}
</code></pre>

For example:

<pre><code> a = override(a, function(original_a) {
 if (condition) { new_code(); original_a(); }
 else { original_a(); other_new_code(); }
 });
</code></pre>

Edit: Fixed a typo.

blocks|key|1472837|text|传递任意参数：|type|unstyled|depth|inlineStyleRanges|entityRanges|data|1472838|a+=+override(a,+function(original_a)+{
++++if+(condition)+{+new_code();+original_a.apply(this,+arguments)+;+}
++++else+{+original_a.apply(this,+arguments);+other_new_code();+}
});|code-block|syntax|javascript|1472839|entityMap^0|0|0^^$0|@$1|2|3|4|5|6|7|I|8|@]|9|@]|A|$]]|$1|B|3|C|5|D|7|J|8|@]|9|@]|A|$E|F]]|$1|G|3|-4|5|6|7|K|8|@]|9|@]|A|$]]]|H|$]]

Passing arbitrary arguments:

<pre><code>a = override(a, function(original_a) {
 if (condition) { new_code(); original_a.apply(this, arguments) ; }
 else { original_a.apply(this, arguments); other_new_code(); }
});
</code></pre>

blocks|key|1473107|text|@Matthew+Crumley提供的答案是利用直接调用的函数表达式，将较旧的'a‘函数关闭到返回函数的执行上下文中。我认为这是最好的答案，但就我个人而言，我更喜欢将函数'a‘作为参数传递给Life.我认为这更容易理解。|type|unstyled|depth|inlineStyleRanges|entityRanges|data|1473108|+++var+a+=+(function(original_a)+{
++++++++if+(condition)+{
++++++++++++return+function()+{
++++++++++++++++new_code();
++++++++++++++++original_a();
++++++++++++}
++++++++}+else+{
++++++++++++return+function()+{
++++++++++++++++original_a();
++++++++++++++++other_new_code();
++++++++++++}
++++++++}
++++})(a);|code-block|syntax|javascript|1473109|entityMap^0|0|0^^$0|@$1|2|3|4|5|6|7|I|8|@]|9|@]|A|$]]|$1|B|3|C|5|D|7|J|8|@]|9|@]|A|$E|F]]|$1|G|3|-4|5|6|7|K|8|@]|9|@]|A|$]]]|H|$]]

The answer that @Matthew Crumley provides is making use of the immediately invoked function expressions, to close the older 'a' function into the execution context of the returned function. I think this was the best answer, but personally, I would prefer passing the function 'a' as an argument to IIFE. I think it is more understandable.

<pre><code> var a = (function(original_a) {
 if (condition) {
 return function() {
 new_code();
 original_a();
 }
 } else {
 return function() {
 original_a();
 other_new_code();
 }
 }
 })(a);
</code></pre>

blocks|key|1472878|text|上面的示例没有正确地应用this或将arguments正确地传递给函数覆盖。下划线_.wrap()包装现有函数，应用this并正确传递arguments。请参阅：http://underscorejs.org/#wrap|type|unstyled|depth|inlineStyleRanges|offset|length|style|CODE|entityRanges|data|1472879|entityMap|0|LINK|mutability|MUTABLE|url|http://underscorejs.org/#wrap^0|C|4|I|9|1M|4|1V|9|29|T|0|0^^$0|@$1|2|3|4|5|6|7|N|8|@$9|O|A|P|B|C]|$9|Q|A|R|B|C]|$9|S|A|T|B|C]|$9|U|A|V|B|C]]|D|@$9|W|A|X|1|Y]]|E|$]]|$1|F|3|-4|5|6|7|Z|8|@]|D|@]|E|$]]]|G|$H|$5|I|J|K|E|$L|M]]]]

The examples above don't correctly apply <code>this</code> or pass <code>arguments</code> correctly to the function override. Underscore _.wrap() wraps existing functions, applies <code>this</code> and passes <code>arguments</code> correctly. See: <a href="http://underscorejs.org/#wrap" rel="nofollow">http://underscorejs.org/#wrap</a>

blocks|key|1472939|text|我有一些别人写的代码，我想在代码中找不到的函数中添加一行。因此，作为一种变通方法，我想要覆盖它。|type|unstyled|depth|inlineStyleRanges|entityRanges|data|1472940|然而，这些解决方案对我来说都不起作用。|1472941|以下是在我的案例中起作用的方法：|1472942|if+(typeof+originalFunction+===+"undefined")+{
++++originalFunction+=+targetFunction;
++++targetFunction+=+function(x,+y)+{
++++++++//Your+code
++++++++originalFunction(a,+b);
++++++++//Your+Code
++++};++
}|code-block|syntax|javascript|1472943|entityMap^0|0|0|0|0^^$0|@$1|2|3|4|5|6|7|M|8|@]|9|@]|A|$]]|$1|B|3|C|5|6|7|N|8|@]|9|@]|A|$]]|$1|D|3|E|5|6|7|O|8|@]|9|@]|A|$]]|$1|F|3|G|5|H|7|P|8|@]|9|@]|A|$I|J]]|$1|K|3|-4|5|6|7|Q|8|@]|9|@]|A|$]]]|L|$]]

I had some code written by someone else and wanted to add a line to a function which i could not find in the code. So as a workaround I wanted to override it.

None of the solutions worked for me though.

Here is what worked in my case:

<pre><code>if (typeof originalFunction === "undefined") {
 originalFunction = targetFunction;
 targetFunction = function(x, y) {
 //Your code
 originalFunction(a, b);
 //Your Code
 }; 
}
</code></pre>

blocks|key|1472998|text|我为类似的场景创建了一个小帮助器，因为我经常需要覆盖几个库中的函数。这个帮助器接受一个“名称空间”(函数容器)、函数名和覆盖函数。它将用新函数替换引用的命名空间中的原始函数。|type|unstyled|depth|inlineStyleRanges|entityRanges|data|1472999|新函数接受原始函数作为第一个参数，原始函数的参数作为其余参数。它每次都会保留上下文。它还支持void和non-void函数。|1473000|function+overrideFunction(namespace,+baseFuncName,+func)+{
++++var+originalFn+=+namespace[baseFuncName];
++++namespace[baseFuncName]+=+function+()+{
++++++++return+func.apply(this,+[originalFn.bind(this)].concat(Array.prototype.slice.call(arguments,+0)));
++++};
}|code-block|syntax|javascript|1473001|例如，Bootstrap的用法：|1473002|overrideFunction($.fn.popover.Constructor.prototype,+'leave',+function(baseFn,+obj)+{
++++//+...+do+stuff+before+base+call
++++baseFn(obj);
++++//+...+do+stuff+after+base+call
});|1473003|不过，我没有创建任何性能测试。它可能会增加一些不必要的开销，这可能是大问题，也可能不是大问题，具体取决于场景。|1473004|entityMap^0|0|0|0|0|0|0^^$0|@$1|2|3|4|5|6|7|Q|8|@]|9|@]|A|$]]|$1|B|3|C|5|6|7|R|8|@]|9|@]|A|$]]|$1|D|3|E|5|F|7|S|8|@]|9|@]|A|$G|H]]|$1|I|3|J|5|6|7|T|8|@]|9|@]|A|$]]|$1|K|3|L|5|F|7|U|8|@]|9|@]|A|$G|H]]|$1|M|3|N|5|6|7|V|8|@]|9|@]|A|$]]|$1|O|3|-4|5|6|7|W|8|@]|9|@]|A|$]]]|P|$]]

I've created a small helper for a similar scenario because I often needed to override functions from several libraries. This helper accepts a "namespace" (the function container), the function name, and the overriding function. It will replace the original function in the referred namespace with the new one. 

The new function accepts the original function as the first argument, and the original functions arguments as the rest. It will preserve the context everytime. It supports void and non-void functions as well.

<pre><code>function overrideFunction(namespace, baseFuncName, func) {
 var originalFn = namespace[baseFuncName];
 namespace[baseFuncName] = function () {
 return func.apply(this, [originalFn.bind(this)].concat(Array.prototype.slice.call(arguments, 0)));
 };
}
</code></pre>

Usage for example with Bootstrap:

<pre><code>overrideFunction($.fn.popover.Constructor.prototype, 'leave', function(baseFn, obj) {
 // ... do stuff before base call
 baseFn(obj);
 // ... do stuff after base call
});
</code></pre>

I didn't create any performance tests though. It can possibly add some unwanted overhead which can or cannot be a big deal, depending on scenarios.

blocks|key|1473059|text|在我看来，排名靠前的答案是不可读/不可维护的，其他答案没有正确地绑定上下文。下面是一个使用ES6语法来解决这两个问题的可读性解决方案。|type|unstyled|depth|inlineStyleRanges|entityRanges|data|1473060|const+orginial+=+someObject.foo;
someObject.foo+=+function()+{
++if+(condition)+orginial.bind(this)(...arguments);
};|code-block|syntax|javascript|1473061|entityMap^0|0|0^^$0|@$1|2|3|4|5|6|7|I|8|@]|9|@]|A|$]]|$1|B|3|C|5|D|7|J|8|@]|9|@]|A|$E|F]]|$1|G|3|-4|5|6|7|K|8|@]|9|@]|A|$]]]|H|$]]

In my opinion the top answers are not readable/maintainable, and the other answers do not properly bind context. Here's a readable solution using ES6 syntax to solve both these problems.

<pre><code>const orginial = someObject.foo;
someObject.foo = function() {
 if (condition) orginial.bind(this)(...arguments);
};
</code></pre>

blocks|key|1688248|text|因此，我的答案最终是一种解决方案，允许我使用指向原始对象的_this变量。我创建了一个新的"Square“实例，但是我讨厌"Square”生成它的大小的方式。我认为它应该符合我的特定需求。然而，为了做到这一点，我需要广场有一个更新的"GetSize“函数，该函数的内部调用广场中已经存在的其他函数，如this.height，this.GetVolume()。但为了做到这一点，我需要在没有任何疯狂的黑客的情况下做到这一点。所以这是我的解决方案。|type|unstyled|depth|inlineStyleRanges|entityRanges|data|1688249|一些其他对象初始化器或帮助器函数。|1688250|this.viewer+=+new+Autodesk.Viewing.Private.GuiViewer3D(
++this.viewerContainer)
var+viewer+=+this.viewer;
viewer.updateToolbarButtons+=++this.updateToolbarButtons(viewer);|code-block|syntax|javascript|1688251|函数在另一个对象中。|1688252|updateToolbarButtons+=+function(viewer)+{
++var+_viewer+=+viewer;
++return+function(width,+height){+
blah+blah+black+sheep+I+can+refer+to+this.anything();
}
};|1688253|entityMap^0|0|0|0|0|0^^$0|@$1|2|3|4|5|6|7|O|8|@]|9|@]|A|$]]|$1|B|3|C|5|6|7|P|8|@]|9|@]|A|$]]|$1|D|3|E|5|F|7|Q|8|@]|9|@]|A|$G|H]]|$1|I|3|J|5|6|7|R|8|@]|9|@]|A|$]]|$1|K|3|L|5|F|7|S|8|@]|9|@]|A|$G|H]]|$1|M|3|-4|5|6|7|T|8|@]|9|@]|A|$]]]|N|$]]

So my answer ended up being a solution that allows me to use the _this variable pointing to the original object. 
I create a new instance of a "Square" however I hated the way the "Square" generated it's size. I thought it should follow my specific needs. However in order to do so I needed the square to have an updated "GetSize" function with the internals of that function calling other functions already existing in the square such as this.height, this.GetVolume(). But in order to do so I needed to do this without any crazy hacks. So here is my solution.

Some other Object initializer or helper function.

<pre><code>this.viewer = new Autodesk.Viewing.Private.GuiViewer3D(
 this.viewerContainer)
var viewer = this.viewer;
viewer.updateToolbarButtons = this.updateToolbarButtons(viewer);
</code></pre>

Function in the other object.

<pre><code>updateToolbarButtons = function(viewer) {
 var _viewer = viewer;
 return function(width, height){ 
blah blah black sheep I can refer to this.anything();
}
};
</code></pre>

I have a function, <code>a()</code>, that I want to override, but also have the original <code>a()</code> be performed in an order depending on the context. For example, sometimes when I'm generating a page I'll want to override like this:

<pre><code>function a() {
 new_code();
 original_a();
}
</code></pre>

and sometimes like this:

<pre><code>function a() {
 original_a();
 other_new_code();
}
</code></pre>

How do I get that <code>original_a()</code> from within the over-riding <code>a()</code>? Is it even possible?

Please don't suggest alternatives to over-riding in this way, I know of many. I'm asking about this way specifically.

Overriding a JavaScript function while referencing the original

性能测试

容器

我有一个函数a()，我想要覆盖它，但也要让原始的a()按照上下文的顺序执行。例如，有时当我生成一个页面时，我想要覆盖如下所示：function a() {    new_code();    original_a();}有时就像这样：function a() {    original_a();    other_new_code();}如何从重写的a()中获取该original_a()？这有可能

问重写JavaScript函数，同时引用原始
EN

回答 9

Stack Overflow用户

Stack Overflow用户

Stack Overflow用户

社区

活动

资源

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问重写JavaScript函数，同时引用原始EN

回答 9

Stack Overflow用户

Stack Overflow用户

Stack Overflow用户

社区

活动

资源

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问重写JavaScript函数，同时引用原始
EN