为什么JavaScript变量以美元符号开头?

时间:2008-10-15 18:26:35

标签: javascript naming-conventions

我经常看到带有以美元符号开头的变量的JavaScript。何时/为什么你会选择以这种方式为变量添加前缀?

(我不是问你在jQuery和其他人看到的$('p.foo')语法,而是$name$order等常规变量

16 个答案:

答案 0 :(得分:1334)

jQuery中非常常见的用法是将存储在变量中的jQuery对象与其他变量区分开来。例如,我会定义

var $email = $("#email"); // refers to the jQuery object representation of the dom object
var email_field = $("#email").get(0); // refers to the dom object itself

我发现这对编写jQuery代码非常有帮助,并且可以很容易地看到具有不同属性集的jQuery对象。

答案 1 :(得分:234)

在第1版,第2版和3rd Edition of ECMAScript中,除了自动生成代码的上下文外,规范明确禁止使用$ -prefixed变量名:

  

标识符中的任何位置都允许使用美元符号($)和下划线(_)。美元符号仅用于机械生成的代码。

但是,在下一个版本(当前的5th Edition)中,此限制被删除,上面的段落被替换为

  

美元符号($)和下划线(_)可以在 IdentifierName 中的任何位置使用。

因此,$ sign现在可以在变量名中自由使用。某些框架和库对符号的含义有各自的约定,这里有其他答案。

答案 2 :(得分:57)

正如其他人所提到的,美元符号旨在由机械生成的代码使用。但是,一些非常流行的JavaScript库打破了这种惯例。 JQuery,Prototype和MS AJAX(AKA Atlas)都在其标识符中使用此字符(或作为整个标识符)。

简而言之,您可以随时使用$。 (翻译不会抱怨。)问题是你什么时候想要使用它?

我个人不使用它,但我认为它的使用是有效的。我认为MS AJAX使用它来表示函数是一个更冗长的调用的别名。

例如:

var $get = function(id) { return document.getElementById(id); }

这似乎是一个合理的惯例。

答案 3 :(得分:53)

在AngularJS的上下文中,$前缀仅用于框架代码中的标识符。指示框架的用户不要在他们自己的标识符中使用它:

  

角度命名空间$$$

     

为防止与您的代码意外发生名称冲突,Angular会为具有$的公共对象的名称和$$的私有对象的名称添加前缀。请不要在代码中使用$$$前缀。

来源:https://docs.angularjs.org/api

答案 4 :(得分:21)

我是2006年创立这个大会的人,并在早期的jQuery邮件列表中推广它,所以让我分享一下它的历史和动机。

接受的答案给出了这个例子:

var $email = $("#email"); // refers to the jQuery object representation of the dom object
var email_field = $("#email").get(0); // refers to the dom object itself

但这并没有真正说明。即使没有$,我们仍然会在这里有两个不同的变量名称,emailemail_field。那里很好。当我们已经有两个不同的名字时,为什么我们需要将$扔进其中一个名字?

实际上,我不会在这里使用email_field有两个原因:names_with_underscores不是惯用的JavaScript,field对DOM来说没有用元件。但我确实遵循了同样的想法。

我尝试了一些不同的东西,其中有一些非常类似的例子:

var email = $("#email"), emailElement = $("#email")[0];
// Now email is a jQuery object and emailElement is the first/only DOM element in it

(当然jQuery对象可以有多个DOM元素,但我正在处理的代码有很多id选择器,因此在这些情况下有1:1的对应关系。)

我有另一种情况,一个函数接收一个DOM元素作为参数,并且还需要一个jQuery对象:

// email is a DOM element passed into this function
function doSomethingWithEmail( email ) {
    var emailJQ = $(email);
    // Now email is the DOM element and emailJQ is a jQuery object for it
}

那有点令人困惑!在我的一些代码中,email是jQuery对象,emailElement是DOM元素,但在另一方面,email是DOM元素,emailJQ是jQuery对象。

没有一致性,我一直把它们混合起来。另外,为了同一件事情而不得不为两个不同的名称组成一个小麻烦:一个用于jQuery对象,另一个用于匹配的DOM元素。除了emailemailElementemailJQ之外,我还在尝试其他变体。

然后我注意到一个共同的模式:

var email = $("#email");
var emailJQ = $(email);

由于JavaScript将$简称为另一个名字的字母,因为我总是从$(whatever)调用中得到一个jQuery对象,所以这个模式终于明白了。我可以进行$(...)调用,只删除一些字符,它会得到一个非常好的名字:

$("#email")
$(email)

Strikeout并不完美,但你可能会有这样的想法:删除一些字符后,这两行最终看起来像:

$email

当我意识到我不需要制定像emailElementemailJQ这样的约定时。已经有一个很好的约定盯着我:从$(whatever)电话中取出一些角色,然后变成$whatever

var $email = $("#email"), email = $email[0];
// $email is the jQuery object and email is the DOM object

// email is a DOM element passed into this function
function doSomethingWithEmail( email ) {
    var $email = $(email);
    // $email is the jQuery object and email is the DOM object
    // Same names as in the code above. Yay!
}

所以我不必一直编造两个不同的名字,但可以使用带有或不带$前缀的相同名称。 $前缀提醒我正在处理jQuery对象:

$('#email').click( ... );

或:

var $email = $('#email');
// Maybe do some other stuff with $email here
$email.click( ... );

答案 5 :(得分:20)

Stevo是对的,美元脚本符号的含义和用法(在Javascript和jQuery平台中,但在PHP中没有)是完全语义的。 $是一个可以用作标识符名称一部分的字符。此外,美元符号可能不是您在Javascript中可能遇到的最“奇怪”的事情。以下是有效标识符名称的一些示例:

var _       = function() { alert("hello from _"); }
var \u0024  = function() { alert("hello from $ defined as u0024"); }
var Ø       = function() { alert("hello from Ø"); }
var $$$$$   = function() { alert("hello from $$$$$"); }

以上所有例子都有效。

尝试一下。

答案 6 :(得分:7)

$ character对JavaScript引擎没有特殊意义。它只是变量名中的另一个有效字符,如a-z,A-Z,_,0-9等......

答案 7 :(得分:2)

由于变量名称开头的_经常用于表示私有变量(或者至少有一个私有变量),我发现$方便在我自己的前面添加简短别名到通用代码库。

例如,在使用jQuery时,我更喜欢使用变量$J(而不仅仅是$)并在使用php.js等时使用$P

前缀使它在视觉上与其他变量(例如我自己的静态变量)截然不同,让我知道代码是某个库或其他库的一部分,并且一旦他们知道约定就不太可能发生冲突或混淆。

它也不会使代码混乱(或需要额外的输入),因为为每个库调用重复一个完全指定的名称。

我喜欢把它想象成类似于修改键来扩展单键的可能性。

但这只是我自己的惯例。

答案 8 :(得分:2)

正如我在过去4年中所经历的那样,它将允许某人轻松识别指向值/对象或jQuery包装DOM元素的变量

Ex:
var name = 'jQuery';
var lib = {name:'jQuery',version:1.6};

var $dataDiv = $('#myDataDiv');

在上面的例子中,当我看到变量“$ dataDiv”时,我可以很容易地说这个变量指向一个jQuery包装的DOM元素(在这种情况下它是div)。而且我可以调用所有的jQuery方法,而不是再次包装对象,如$ dataDiv.append(),$ dataDiv.html(),$ dataDiv.find()而不是$($ dataDiv).append()。

希望它可能会有所帮助。 所以最后要说的是遵循这个但不是强制性的好习惯。

答案 9 :(得分:0)

虽然您可以简单地使用它来为您的标识符添加前缀,但它应该用于生成的代码,例如模板中的替换标记。

答案 10 :(得分:0)

${varname}只是jQuery开发人员用来区分持有jQuery元素的变量的命名约定。

普通{varname}用于存储文本和字符串等常规内容。 ${varname}包含从jQuery返回的元素。

你也可以使用普通的{varname}来存储jQuery元素,但正如我在开头所说的那样,它将它与普通变量区分开来,使它更容易理解(想象一下将它混淆为一个简单的变量和搜索到处了解它的含义。

例如:

var $blah = $(this).parents('.blahblah');

这里,blah正在存储一个返回的jQuery元素。

因此,当其他人在代码中看到$blah时,他们会理解它不仅仅是字符串或数字,而是jQuery元素。

答案 11 :(得分:-2)

Angular用于框架生成的属性。猜猜看,他们正在接受ECMA-262 3.0提供的(现已解散)提示。

答案 12 :(得分:-2)

在普通变量的情况下,

$用于公共变量和jquery变量之间的DISTINGUISH。 让你在FLIPKART中下订单然后如果订单是一个显示字符串输出的变量,那么它被命名为simple“order”但如果我们点击地点顺序然后返回一个对象,该对象将被$表示为“$命令“以便程序员可以在整个代码中剪掉javascript变量和jquery变量。

答案 13 :(得分:-3)

如果您看到美元符号($)或双美元符号($$),并且对Prototype框架中的含义感到好奇,请回答:

$$('div');
// -> all DIVs in the document.  Same as document.getElementsByTagName('div')!

$$('#contents');
// -> same as $('contents'), only it returns an array anyway (even though IDs must be unique within a document).

$$('li.faux');
// -> all LI elements with class 'faux'

来源:
http://www.prototypejs.org/api/utility/dollar-dollar

答案 14 :(得分:-4)

我有时使用php名称约定和javascript变量的原因: 在进行输入验证时,我想在客户端运行完全相同的算法, 和服务器端。我真的希望代码的两面看起来尽可能相似,以简化维护。在变量名中使用美元符号可以使这更容易。

(另外,一些明智的帮助函数有助于使代码看起来相似,例如包装输入值查找,非OO版本的strlen,substr等。但它仍然需要一些手动调整。)

答案 15 :(得分:-4)

有效的JavaScript标识符shuold必须以字母开头,     下划线(_)或美元符号($);    后续人物也可以     是数字(0-9)。因为JavaScript区分大小写,     信     包括字符“A”到“Z”(大写)和     字符“a”到“z”(小写)。

详细说明:
https://developer.mozilla.org/en-US/docs/Web/JavaScript/Guide/Grammar_and_types#Variables