用$（函数等）启动javascript代码
我正在研究Backbone和来自http://todomvc.com/的todo示例应用程序。我注意到有三种方法可以在文件中启动代码：
$(function() { // code here }); $(function( $ ) { // code here }); (function() { // code here }()); 我不明白这些差异，何时应该使用另一个。
我也看到一些人使用它来启动他们的代码：
$(document).ready(function(){ // code here });
从我所看到的，这是完整的写作方式吗？
以更一般的方式，我是否应该始终将我的javascript代码包含在每个文件中的类似内容中？
谢谢你的建议。
-
$(document).ready(function(){})确保您的代码在DOM上运行，以便您可以访问DOM。 您可以在jQuery的文档中阅读更多相关信息 。 -
$(function(){})只是＃1的别名。 这里的任何代码都会等待DOM准备好（ 参见文档 ）。 -
$(function($){})等同于＃1和＃2，只有你在本地范围内获得对jQuery的干净引用（参见下面的注释）。 您也可以将$传递给＃1中的函数，它将执行相同的操作（创建对jQuery的本地引用）。 -
(function(){}())只是一个自执行的匿名函数 ，用于创建一个新的闭包。
请注意，这些都不是Backbone特有的。 前3个是jQuery特有的，而＃4只是vanilla JavaScript。
注意：要了解上面＃3中发生的情况，请记住$是jQuery的别名。 但是，jQuery不是唯一使用$变量的库。 由于$可能会被其他人覆盖，因此您希望确保在您的范围内， $将始终引用jQuery – 因此$参数。
最后，它基本上归结为以下两个选项：
-
如果您的JavaScript已加载到
head，则必须等待文档准备就绪，因此请使用以下命令：jQuery(function($) { // Your code goes here. // Use the $ in peace... }); -
如果你将JavaScript加载到文档的底部（在结束体标记之前 – 你肯定应该这样做 ），那么就没有必要等待文档就绪（因为DOM已经在解析器到达你的文件时构建了）脚本）， SEAF （AKA IIFE ）就足够了：
(function($) { // Use the $ in peace... }(jQuery));
PS为了更好地理解闭包和范围，请参阅JS101：关于范围的简要课程 。
我想通过实现$ = jQuery开始是有意义的。 在阅读匿名函数中的命名空间时，下面的目的将更有意义。 但实际上，您可以使用它们中的任何一个。 如果他们使用多个库，并且希望另一个使用$ ，则可以使用jQuery()而不是$() 。
$(document).ready(function(){ // Here we have jQuery(document) firing off the ready event // which executes once the DOM has been created in // order to ensure that elements you are trying to manipulate exist. }); $(function () { // Short-hand version of $(document).ready(function () { }); });
有关Document.ready（）的更多信息
将$放在括号内可确保jQuery $别名 （您可以安全地始终以这种方式表示jQuery）。
$(function ($) { /* code here : $ always means jQuery now */ });
最后你有一个IIFE（Immidiately-Invoked Function Expression） – IIFE解释
(function (myNameSpace, $) { // This is an anonymous function - it is ran instantly // Usually used for namespaces / etc // This creates a scope/wrapper/closure around everything inside of it }(window.myNameSpace, jQuery));
顶部的$（与底部匹配的jQuery）表示$（美元符号）代表namepsace范围内的jQuery。 这样做是为了确保其他库不会与开发人员打算/想要使用$的内容发生冲突。
(function (myNameSpace, $) { // Now because of all of this scope/wrapper/closure awesome... // you can create -INTERNAL- variables (sort of like Private variables from other langs) // this variable cannot be accessed outside the namespace unless it is returned / exposed var internalVariable = '123'; // Internal // Even Internal functions! function privateFunction () { console.log('this is private!'); } // -------------------------------------------------------- // Public -method- of nameSpace exposing a private variable // Notice we're using the myNameSpace object we exposed at the top/bottom myNameSpace.nameSpaceMethod = function () { privateFunction(); // we can call the private function only inside of the namespace return internalVariable; // now we could get this variable }; }(window.myNameSpace, jQuery)); // notice these mirror the above arguments in the anon function
有关匿名函数的更多信息
现在，如果我们在命名空间之外 ，我们可以看到这些内部/公共方法和变量是如何实现的：
// This will come up undefined alert(internalVariable); // This will trigger a -method- of the myNameSpace namespace - and alert "123" // Showcasing how we access a Public method - which itself has access to the internal variable // and exposes it to us! alert(myNameSpace.nameSpaceMethod());
这两个：
$(function() { // code here }); $(document).ready(function(){ // code here });
直接等效，它们都是在文档加载时启动一些jQuery的方法。 前者只是后者的缩短版本。
这个：
(function() { // code here }());
只是一个带有零参数的范围函数，可以立即使用零参数调用。