JavaScript中"$"符号的含义是什么?

207
在以下的JavaScript代码中出现了一个美元符号($)。它代表什么意思?
$(window).bind('load', function() {
    $('img.protect').protectImage();
});

1
参见:https://dev59.com/J3VC5IYBdhLWcg3wtzkQ#553734(为什么JavaScript变量会以美元符号开头?) - Thomas Tempelmann
8个回答

316

你的代码片段似乎引用了一些流行的JavaScript库中的方法(如jQuery、ProtoType、mooTools等)。

在JavaScript中使用$并没有什么神秘的地方,它只是一个有效的JavaScript标识符。JavaScript允许大写和小写字母(不仅限于英文),数字(但不能作为第一个字符),$_以及其他一些字符¹。

Prototype、jQuery和大多数JavaScript库使用$作为主要基对象(或函数)。它们中的大多数也有一种方法可以放弃$,以便它可以与使用它的另一个库一起使用。在这种情况下,您可以使用jQuery代替$。实际上,$只是jQuery的一个快捷方式。


¹ 对于标识符的第一个字符,JavaScript允许使用"...任何具有Unicode属性“ID_Start”的Unicode代码点...以及$_; 详细信息请参见规范。对于标识符中的后续字符,它允许任何具有ID_Continue(包括_)和$(以及一些用于历史兼容性的控制字符)的字符。


+1 是一个合法的 JavaScript 标识符,通常作为 JavaScript 框架的别名使用。 - Gumbo
@Paolo:通常是这样的。然而,没有迹象表明OP想知道这个。直接回答也是一件好事。 :) 话虽如此,我仍然同意这是一个更好的答案。我唯一的争论点是你在强调特定点上。 - Noldorin
我认为Noldorin的回答很好。 :-) 我要在最前面加一句话,说这段代码看起来像是引用了流行的JS库中的方法。 - Nosredna
@Noldorin:直接的问题在标题中,标题说“$符号在JavaScript中的含义是什么”- 直接回答这个问题,非常相关的是它只是一个有效的标识符,恰好被库使用。你的答案显然是正确的,但只考虑了正文。 - Paolo Bergantino
这段代码的意思是什么:$input.prop('type') == 'radio'; - OKGimmeMoney
@CanIHaveSomeChange的意思是它正在比较(可能是您的输入字段)的类型和“单选按钮”,它将返回truefalse - Ravi Dhoriya ツ

63

来自另一个答案:

一点历史

请记住,$与其他变量名并没有本质上的不同。早期的时候,人们使用document.getElementById编写代码。由于JavaScript是大小写敏感的,在编写document.getElementById时很容易犯错。我应该大写'by'b吗?我应该大写Idi吗?你明白了。因为函数在JavaScript中是一等公民,所以你总是可以这样做:

var $ = document.getElementById; //freedom from document.getElementById!
当Prototype库出现时,他们将获取DOM元素的函数命名为'$'。几乎所有的JavaScript库都复制了这个想法。Prototype还引入了一个$$函数,以使用CSS选择器选择元素。
jQuery也采用了$函数,但扩展了它,使其接受各种“选择器”以获取所需的元素。现在,如果您已经在项目中使用Prototype并想要包含jQuery,则会出现问题,因为'$'可能指的是Prototype的实现或jQuery的实现。这就是为什么jQuery有noConflict选项的原因,这样您可以在使用Prototype的项目中包含jQuery,并逐渐迁移代码。我认为这是约翰(John)做出的精彩举措! :)

17
在Firefox或Google Chrome中,var $ = document.getElementById;无法正常使用。相反,您应该使用function $(id) { return document.getElementById(id); }。有关更多信息,请参见https://dev59.com/h3NA5IYBdhLWcg3wVcJx。 - Grant Wagner
1
我不知道这个,谢谢Grant。我可以确认这个技巧曾经在IE6和Firefox 2中起作用,因为我经常使用它。我会更新我的主要帖子。 - SolutionYogi
1
实际上,它应该是:function $(sel) { return document.querySelectorAll(sel); } - Nanoo
1
@Nanoo 您的评论仍然有效,在许多情况下非常有用。如果您使用自己的方法,甚至可以搜索类和ID。 - Heewoon

48

这很可能是jQuery代码(更准确地说是使用了jQuery库的JavaScript代码)。

$表示jQuery函数,实际上它是jQuery的简写别名。(与大多数编程语言不同,$符号不是保留字,可以用作变量名。)它通常用作选择器(即返回在DOM中找到的一组元素的函数)。


4
你应该补充说明$符号就像x一样,它可以表示你分配给它的任何值。 - hasen
这段代码的意思是什么:$input.prop('type') == 'radio'; - OKGimmeMoney

37

正如其他答案所述,它可能是几乎任何东西,但通常是 "JQuery"。

但是,在ES6中,它是一个字符串插值运算符,在模板字面量中使用,例如:

var s = "new" ; // you can put whatever you think appropriate here.
var s2 = `There are so many ${s} ideas these days !!` ; //back-ticks not quotes
console.log(s2) ;

结果:

这些天有很多新的想法!!


4
这是一个有用的回答!这就是我一直在寻找的答案,因为我知道我们没有 jQuery 或任何其他库。它基本上是一种在不使用引号和加号等符号的情况下在较长的字符串中打印变量的方法。 - Oscar Bravo

20

$()是在jQuery库中使用的jQuery()的缩写。


5
除了以上回答,$ 在 JavaScript 中并没有特殊的含义,可以自由地用于对象命名。在 jQuery 中,它只是作为 jQuery 对象和 jQuery() 函数的别名使用。 但是,您可能会遇到这样的情况,想要与另一个同样使用 $ 的 JS 库结合使用,这将导致命名冲突。JQuery 中有一个专门解决此问题的方法,jQuery.noConflict()
这里是来自 jQuery 文档的示例:
<script src="other_lib.js"></script>
<script src="jquery.js"></script>
<script>
$.noConflict();
// Code that uses other library's $ can follow here.
</script>

您可以使用类似于这样的方式进行操作。
(function ($) {
// Code in which we know exactly what the meaning of $ is
} (jQuery));

Ref:https://api.jquery.com/jquery.noconflict/


3
从jQuery文档描述jQuery Core Object:(链接) 许多开发人员在包含jQuery对象的变量名称前添加$以帮助区分。这种做法没有什么神奇之处 - 它只是帮助某些人跟踪不同变量包含的内容。

-1

基本语法是:$(选择器).操作()

美元符号用于定义jQuery,A(选择器)用于“查询(或查找)”HTML元素,jQuery操作()用于对元素执行操作。


网页内容由stack overflow 提供, 点击上面的
可以查看英文原文,
原文链接