javascript jQuery 插件 Vs 中的私有函数。在每个循环之外
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/4629083/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
jQuery plugin Private functions inside Vs. Outside the each loop
提问by Pablo
What is the difference between including private functions in a jQuery plugin in the examples below:
在下面的示例中，在 jQuery 插件中包含私有函数有什么区别：
Outside the loop:
循环外：
(function( $ ){
var defaults = {};
$.fn.cmFlex = function(opts) {
this.each(function() {
var $this = $(this);
//Element specific options
var o = $.extend({}, defaults, opts);
//Code here
});
function f1(){....
function f3(){....
function f2(){....
};
})( jQuery );
Inside the loop:
循环内：
(function( $ ){
var defaults = {};
$.fn.cmFlex = function(opts) {
this.each(function() {
var $this = $(this);
//Element specific options
var o = $.extend({}, defaults, opts);
function f1(){....
function f3(){....
function f2(){....
});
};
})( jQuery );
The advantage of including the functions in the loop is that i will be able to access the $this variable as well as the Element specific options from f1() f2() f3(), are there any disadvantages to this?
在循环中包含函数的优点是我将能够访问 $this 变量以及 f1() f2() f3() 中的元素特定选项，这有什么缺点吗？
回答by Juan Mendes
Always follow the concept of giving the least privilege to all your code. If no other code needs to reference those functions, there's no need to define them outside and changing those functions is simpler since you are guaranteed that they are not used anywhere else but within the loop.
始终遵循为所有代码提供最小权限的概念。如果没有其他代码需要引用这些函数，则无需在外部定义它们，更改这些函数会更简单，因为您可以保证它们不会在循环内的任何其他地方使用。
If f1,f2,f3 needed access to closure variables within the looping function, they'd have to be defined in the function no matter what.
如果 f1,f2,f3 需要访问循环函数内的闭包变量，则无论如何都必须在函数中定义它们。
However there's a caveat. Defining them within a function requires creating a new closure every time the loop function is run. Depending on how tight the loop is, it could affect performance. My point is: premature optimization is bad, but keep it in mind.
但是，有一个警告。在函数中定义它们需要在每次循环函数运行时创建一个新的闭包。根据循环的紧密程度，它可能会影响性能。我的观点是：过早优化是不好的，但请记住这一点。
FYI: Here's another way to do it (if you don't need the closure variables) that avoids creating the closures for every iteration of the loop. It looks a bit complex, so it's not for the faint of heart
仅供参考：这是另一种方法（如果您不需要闭包变量），可以避免为循环的每次迭代创建闭包。它看起来有点复杂，所以它不适合胆小的人
(function( $ ){
var defaults = {};
$.fn.cmFlex = function(opts) {
this.each((function() {
function f1(){}
function f3(){}
function f2(){}
// This is the method that will be called for each iteration of the loop. It now
// has access to f1,f2,f3 but doesn't need to create a closure for each iteration.
return function() {
var $this = $(this);
//Element specific options
var o = $.extend({}, defaults, opts);
f1();
f2();
f3();
};
})());
};
})( jQuery );
回答by casperOne
Depending on what you are trying to acheive, there couldbe; if you need to change the functions down the line so that f1(), f2()or f3()require things outside of that scope, then you have to deal with that migration.
根据您要实现的目标，可能有；如果您需要更改功能f1()，f2()或者f3()需要该范围之外的东西，那么您必须处理该迁移。
However, from an encapsulation standpoint, this is preferable, as those functions will only be accessible from within that scope, making sure there is no "leakage".
然而，从封装的角度来看，这是更可取的，因为这些功能只能从该范围内访问，确保没有“泄漏”。
回答by Pablo
I ended up not using a jQuery plugin at all and encapsulation all the code inside the callback function for the $.getJSON call.
我最终根本没有使用 jQuery 插件，而是将所有代码封装在 $.getJSON 调用的回调函数中。
Here is an example
这是一个例子
$.getJSON('core/cm_json.php', function(options) {
//Globals
var defaults = options;
//Where query is a jQuery query string
function initialize(query){
$(query).each(function(){
var $this = this;
//Code here
function f1(){...
function f2(){...
function f3(){...
})
}
});
回答by ezpn
If you don't want to redeclare methods every time loop function runs and still have access to $this variable, you may try to move functions outside and call them using call method.
如果您不想在每次循环函数运行时重新声明方法并且仍然可以访问 $this 变量，您可以尝试将函数移到外面并使用 call 方法调用它们。
(function( $ ){
var defaults = {};
$.fn.cmFlex = function(opts) {
function f1(){}
function f3(){}
function f2(){}
this.each((function() {
return function() {
var $this = $(this);
//Element specific options
var o = $.extend({}, defaults, opts);
f1.call($this);
f2.call($this);
f3.call($this);
};
})());
};
})( jQuery );
