$ 기호로 시작하는 변수를 가진 JavaScript를 자주 볼 수 있습니다.이러한 방법으로 변수 접두사를 선택하는 경우 또는 이유는 무엇입니까?
(에 대해 묻는 것이 아닙니다.$('p.foo')
jQuery 및 기타에서 볼 수 있는 구문이지만 다음과 같은 일반 변수입니다.$name
그리고.$order
)
질문에 대한 답변
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 객체를 쉽게 볼 수 있습니다.
ECMAScript 제1, 제2 및 제3판에서는 $prefixed 변수명을 사용하는 것은 자동 생성된 코드 컨텍스트를 제외하고 사양에 의해 명시적으로 권장되지 않았습니다.
달러 기호(
$
및 밑줄(_
)는, 식별자내의 임의의 장소에서 사용할 수 있습니다.달러 기호는 기계적으로 생성된 코드에서만 사용할 수 있습니다.
그러나 다음 버전(현행 제5판)에서는 이 제한이 해제되고 위의 단락이 로 대체되었습니다.
달러 기호(
$
및 밑줄(_
)는 IdentifierName 내의 임의의 장소에서 사용할 수 있습니다.
따라서 $ 기호는 변수 이름에 자유롭게 사용할 수 있습니다.일부 프레임워크와 라이브러리에는 기호의 의미에 대한 고유한 규칙이 있습니다. 여기서 설명하는 다른 답변에서 알 수 있습니다.
다른 사람들이 언급했듯이 달러 기호는 기계적으로 생성된 코드에 의해 사용되도록 되어 있습니다.그러나, 그 규약은 널리 알려진 자바스크립트 라이브러리에 의해 깨졌다.JQuery, 프로토타입 및 MS AJAX(일명 AKA Atlas)는 모두 이 문자를 식별자(또는 전체 식별자)에 사용합니다.
즉,$
(통역사는 불평하지 않습니다.)문제는 언제 사용하실 건가요?
개인적으로는 사용하지 않지만, 사용할 수 있다고 생각합니다.MS AJAX는 함수를 보다 상세한 콜의 에일리어스라고 하기 위해서 사용하는 것 같습니다.
예를 들어 다음과 같습니다.
var $get = function(id) { return document.getElementById(id); }
그것은 합리적인 관례인 것 같다.
AngularJS에서는$
접두사는 프레임워크 코드의 식별자에만 사용됩니다.프레임워크 사용자는 자신의 ID에서 이 프레임워크를 사용하지 않도록 지시받습니다.
각진 네임스페이스
$
그리고.$$
코드와 우발적인 이름 충돌을 방지하기 위해 Angular Prefix는 퍼블릭오브젝트 이름 앞에 다음과 같이 붙입니다.
$
및 개인 객체 이름$$
. 를 사용하지 마십시오.$
또는$$
접두사를 입력합니다.
출처 : https://docs.angularjs.org/api
저는 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
하지만 그것은 그것을 잘 설명하지 못한다.이 기능이 없어도$
, 여기에도 두 개의 다른 변수 이름이 있습니다.email
그리고.email_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 엘리먼트의 두 가지 다른 이름을 계속 만들어야 하는 번거로움이 있었습니다.게다가.email
,emailElement
,그리고.emailJQ
다른 변주곡도 계속 시도해봤어요.
그리고 공통적인 패턴을 발견했습니다.
var email = $("#email"); var emailJQ = $(email);
JavaScript가 처리하므로$
단순히 이름에 대한 다른 문자로, 그리고 나는 항상 jQuery 오브젝트를 돌려받았기 때문에$(whatever)
드디어 패턴이 떠올랐어요내가 가져갈 수 있는 건$(...)
몇 개의 문자를 삭제하면, 꽤 좋은 이름이 됩니다.
$
("#email")$
(email)
삼진아웃은 완벽하지는 않지만, 일부 문자를 삭제하면 두 줄 모두 다음과 같이 됩니다.
$email
그때 깨달은 건 내가 규칙을 만들 필요가 없다는 거야emailElement
또는emailJQ
나를 쳐다보는 멋진 컨벤션이 이미 있었다: 캐릭터 몇 개를 꺼내라.$(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! }
그래서 항상 두 개의 다른 이름을 만들 필요는 없었지만, 그냥 같은 이름을 사용할 수 있었다.$
프레픽스그리고 그$
prefix는 jQuery 오브젝트를 다루고 있음을 상기시켜 줍니다.
$('#email').click( ... );
또는 다음과 같이 입력합니다.
var $email = $('#email'); // Maybe do some other stuff with $email here $email.click( ... );