javascript/jQuery中函数定义的差异

Question

版本1:

function add(){
var a = 2;
...
...
...
}

版本2:

$(function(){
var ...
..
..
});

两个版本的主要区别在哪里？对于版本2,它没有函数名称.如果只是简单地运行函数中的代码,为什么不删除$function(){..};.这真让我感到困惑,因为现在很多脚本都是以版本2的风格编写的.请帮助澄清我的困惑.

Answer 1

示例1定义了一个名为的函数add,而示例2只是将一个匿名函数传递给jQuery函数.

该$(function() {...});语法是一个缩写$(document).ready(function() {...});,它接受一个函数作为它的参数,然后执行该功能时,DOM已准备就绪.这用于确保在执行代码之前,您希望在Javascript中使用的元素实际存在.

编辑以解决以下评论:

在.click()jQuery函数有两个用途.如果传递一个函数,那么它会创建一个额外的单击事件处理程序,它将在触发事件时运行该函数.如果未传递函数,则它将触发已附加到jQuery对象中的元素的所有单击事件处理程序.所以,是的,你可以在.click()没有功能的情况下调用,但它不会做同样的事情.

您不能执行以下操作:

$(document).ready(var foo = 2;...);

因为这会给你一个语法错误.但是,您可以按常规方式定义函数,然后将其传递给以下调用$(document).ready():

function foo() {
     var foo = 2;
     ...
}

$(document).ready(foo);