Javascript jquery 文档内部或外部的函数准备就绪
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/2645344/
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
functions inside or outside jquery document ready
提问by Hans
Up until now I just put all my jQuery goodness inside the $(document).ready()function, including simple functions used in certain user interactions.
到目前为止,我只是将我所有的 jQuery 优点放在$(document).ready()函数中,包括在某些用户交互中使用的简单函数。
But functions that don′t require the DOM document to be loaded or are only called afterwards anyway, can be placed outside the $(document).ready()as well. Consider for example a very simple validation function such as:
但是不需要加载 DOM 文档或只在之后调用的函数也可以放在 DOM 之外$(document).ready()。例如,考虑一个非常简单的验证函数,例如:
function hexvalidate(color) {
// Validates 3-digit or 6-digit hex color codes
var reg = /^(#)?([0-9a-fA-F]{3})([0-9a-fA-F]{3})?$/;
return reg.test(color);
}
The function is only called from within the $(document).ready()function though.
但是,该函数仅从$(document).ready()函数内部 调用。
What is best practice (syntax, speed); placing such a function insideor outsidethe jquery document ready function?
什么是最佳实践(语法、速度);将这样的函数放在jquery 文档就绪函数的内部还是外部?
回答by viam0Zah
Put it insideso it won't pollute the global namespace. It also ensures a faster resolve of the function name because of JavaScript's scope chains.
把它放在里面,这样它就不会污染全局命名空间。由于 JavaScript 的作用域链,它还可以确保更快地解析函数名称。
Put it outsideif it's a reusable component so you could easily move it in a separate file and call from different contexts.
如果它是可重用的组件,请将其放在外面,这样您就可以轻松地将其移动到单独的文件中并从不同的上下文中调用。
Since you already use JQuery, it worths mentioning, that in your case you may want to define hexvalidateas a JQuery pluginoutsideand then invoke it inside.
由于您已经使用了 JQuery,值得一提的是,在您的情况下,您可能希望在外部定义hexvalidate为JQuery 插件,然后在内部调用它。
回答by user187291
I don't think you should be using any 'just functions' in the first place. In OOP javascript a "function" usually belongs to one of four distinct types:
我认为您首先不应该使用任何“只是功能”。在 OOP javascript 中,“函数”通常属于四种不同类型之一:
- Constructor or an anonymous 'init' closure - used to construct objects. The only type of function that is allowed to be global
- Method - function that is a part of some object
- Utility - inner function of a constructor/method, invisible from outside
- Constant - a functional constant passed as a parameter
- 构造函数或匿名 'init' 闭包 - 用于构造对象。唯一允许全局的函数类型
- 方法 - 作为某个对象的一部分的函数
- 实用程序 - 构造函数/方法的内部函数,从外部不可见
- 常量 - 作为参数传递的函数常量
e.g.
例如
(function() { <- init closure
function helper1() { <- utility }
globalSomething = {
foobar: function() { <- method
xyz.replace(/.../, function() { <- constant })
}
}
)()
In your example, 'hexvalidate' is obviously a part of Validator object, which, in turn, can be made a jQuery plugin:
在您的示例中,'hexvalidate' 显然是 Validator 对象的一部分,反过来,它可以成为一个 jQuery 插件:
(function($) {
$.validate = {
hexColor: function(color) { ... your code }
more validators...
}
)(jQuery)
回答by Ty W
one advantage of putting those functions inside the document ready function is that they don't pollute your global namespace... with the downside that if you need them somewhere else on the page they won't be available.
将这些函数放在文档就绪函数中的一个优点是它们不会污染您的全局命名空间......缺点是如果您在页面上的其他地方需要它们,它们将不可用。
回答by deceze
If all your functions are only called from within the jQuery(function () { })block, put them inside it. Otherwise you're needlessly polluting the global namespace, which may lead to conflicts down the road.
如果您的所有函数仅从jQuery(function () { })块内调用,请将它们放入其中。否则你会不必要地污染全局命名空间,这可能会导致未来的冲突。
Only declare functions globally that are also used by code in other scopes.
仅全局声明其他作用域中的代码也使用的函数。
回答by Justin Niessner
If you're creating a function that needs to be called outside of the scope of the $(document).ready() function, keep it outside of the $(document).ready() function.
如果您正在创建需要在 $(document).ready() 函数范围之外调用的函数,请将其保留在 $(document).ready() 函数之外。
Otherwise keep it internal.
否则将其保留在内部。

