JavaScript 명명 규칙 [닫기]


257

JavaScript에 가장 적합한 명명 규칙에 대해 많은 논란이 있습니다 (최소한 논란은 아니지만 논쟁).

변수, 함수, 객체 등의 이름을 어떻게 지정합니까?

오랫동안 JS를 수행하지 않았기 때문에 (나만의 커플) 내 생각을 남겨두고 직장에서 프로젝트에 사용할 명명 규칙이있는 문서를 만들라는 요청을 받았습니다. . 그래서 나는 (구글링)을 둘러 보았고 너무 많은 의견이 있습니다.

JS에서 읽은 책들도 다른 이름 지정 규칙을 사용하지만, 모두 "한 가지를 찾아서 고집하십시오"라는 한 가지 의견에 동의합니다. 그러나 이제는 많은 내용을 읽었으므로 지금 사용했던 것보다 약간 더 나은 다른 방법을 좋아한다는 것을 알았습니다.


JS의 상식 명명 규칙에 대한 최신 가이드 : robinwieruch.de/javascript-naming-conventions
Robin Wieruch

답변:


202

Javascript에 대한 Douglas Crockford의 코드 규칙 을 따릅니다 . 또한 JSLint 도구를 사용하여 해당 규칙에 따라 유효성을 검사합니다.


30
JSLint는 많은 개발자에게 너무 급진적이고 제한적일 수 있으므로 JSHint 가 더 나은 선택이 될 수 있습니다.
Pavel Hodek

7
Crockford는 이러한 수준의 세부 사항에 들어 가지 않지만 대문자로 시작하는 변수는 약어를 참조하기 때문에 어떻습니까? 첫 번째 문자 또는 전체 약어는 소문자 여야합니까? 예 : ECBhandlevs. ecbHandle( ECB의 의미는 중요 하지 않습니다 ).
Dan Dascalescu

13
좋은 링크이지만 "링크 답변"에 많은 표가 있다고 믿을 수는 없습니다. 최소한 링크 된 페이지의 관련 부분을 추출하고 형식을 지정할 수 있습니다.
Adrien 수

2
나는 그가 링크와 함께 잘하고 있다고 생각합니다. 우려가되는 경우 게시물을 편집해야합니다.
nckbrz

4
나는 실제로 Crockford를 찾아 보지만 그의 코드 규칙은 매우 구식입니다. @PavelHodek가 목록 아래로 답변을 보도록 조언합니다.
Per Hornshøj-Schierbeck

160

Geoff가 말했듯Crockford의 말이 좋습니다.

내가 따르는 (그리고 널리 사용되는) 유일한 예외는 $ varname을 사용하여 jQuery (또는 모든 라이브러리) 객체를 나타내는 것입니다. 예 :

var footer = document.getElementById('footer');

var $footer = $('#footer');


7
나는 이것에도 $를 사용합니다. 종종 사람들이 $를 사용하여 캐시 된 객체 사본을 나타냅니다. 나는 항상 그것이 단어 놀이라고 가정했습니다. 캐시> "현금"> $
Shawn Whinnery

1
AngularJS를 사용하는 경우 이것이 최선의 아이디어가 아닐 수 있습니다. 핵심 서비스 앞에는 '$'가 붙어 있습니다.
Filip Sobczak

2
변수 이름에 특수 문자를 사용하지 않는 것이 좋습니다. 많은 프레임 워크가 특히 $를 사용합니다.
nckbrz

1
@nixxbb 변수의 범위를 올바르게 지정하면 괜찮습니다. 어떤 프레임 워크도 괜찮습니다.
Andre Figueiredo

1
Crockford의 길드 라인에는 "_의 밑줄을 이름의 첫 번째 또는 마지막 문자로 사용하지 마십시오. 개인 정보 보호를 나타내는 경우도 있습니다"라고 언급합니다. 나는 개인적으로 회원을 나타 내기 위해 밑줄을 사용합니다. 이것은 나쁜 습관입니까? 대안이 있습니까?
Ian G

112

Google JavaScript 스타일 가이드를 따를 수 있습니다

일반적으로 functionNamesLikeThis, variableNamesLikeThis, ClassNamesLikeThis, EnumNamesLikeThis, methodNamesLikeThis 및 SYMBOLIC_CONSTANTS_LIKE_THIS를 사용하십시오.

편집 : JavaScript 스타일 가이드 및 미용사 의 멋진 컬렉션을 참조하십시오 .


15
그들이 Dart와 GWT를 개발했다는 ​​점을 고려할 때 완전히 동의하는지 확실하지 않습니다 (크롬 확장 자바 스크립트 API도 매우 자바와 유사합니다). Google의 일부 팀에게 자바 스크립트를 개발하는 가장 좋은 방법은 다른 언어로 작성하는 것입니다.
badunk

2
난 항상 구글의 개인 이름 지정 규칙을 발견 홀수 대신, _fooBar그들이 fooBar_- 마이크로 소프트가 바로 그것을 가지고 : asp.net/ajaxlibrary/act_contribute_codingStandards.ashx
다니엘 Sokolowski

3
intellisense를 사용하는 경우는 어떻습니까? 밑줄로 많은 수의 변수를 접두어로 입력하면 해당 변수에 액세스 할 때마다 입력해야하는 또 다른 문자 일뿐입니다. 끝으로, 당신의 지능 목록은 더 깨끗해 보이고 필요한 것을 찾는 것이 조금 더 빠릅니다.
FreeAsInBeer

@FreeAsInBeer 추가 캐릭터에 대해서는 사실이지만 더 빨리 생각하지는 않습니다. _개인 변수를 참조 할 때 입력 하면 결과가 제한되어 즉시 인텔리전스가 발생합니다. 결국 개인적인 취향이라고 생각했습니다.
Daniel Sokolowski

1
스타일 가이드 목록에 연결해 주셔서 감사합니다. 나는 독점적으로 따를 가치가 있는지 또는 아직 어느 것을 사용 해야하는지 또는 어떻게 합병을 사용 해야하는지 결정하는 방법을 모르겠습니다. 그러나 한 곳에서 여러 곳을 어디에서 찾을 수 있는지 아는 것은 정말 유익합니다.
Roger_S

9

시도하고 싶은 한 가지 규칙은 'the'접두어로 정적 모듈의 이름을 지정하는 것입니다. 이것 좀 봐. 다른 사람의 모듈을 사용할 때 어떻게 사용해야하는지 쉽게 알 수 없습니다. 예 :

define(['Lightbox'],function(Lightbox) {
  var myLightbox = new Lightbox() // not sure whether this is a constructor (non-static) or not
  myLightbox.show('hello')
})

정적 모듈이 'the'를 사용하여 자신의 존재를 나타내는 규칙을 시도하는 것에 대해 생각하고 있습니다. 이보다 더 나은 방법을 본 사람이 있습니까? 다음과 같이 보일 것입니다 :

define(['theLightbox'],function(theLightbox) {
  theLightbox.show('hello') // since I recognize the 'the' convention, I know it's static
})

6

나는 몇 가지 구문 제한 외에도 명명 규칙 추론은 언어와 무관합니다. 내 말은, c_style_functions와 JavaLikeCamelCase에 찬성하는 주장은 반대 방식으로 동일하게 사용될 수 있습니다. 언어 사용자가 언어 작성자를 따르는 경향이 있습니다.

나는 대부분의 라이브러리가 대략 Java CamelCase의 단순화를 따르는 경향이 있다고 생각합니다. 나는 Douglas Crockford의 조언이 충분히 맛있다는 것을 알았 습니다.


2

그것은 당신이 일하는 방식에 따라 달라질 수있는 개인적인 질문입니다. 어떤 사람들은 "str_message"와 같이 변수의 시작 부분에 변수 유형을 넣기를 좋아합니다. 그리고 어떤 사람들은 단어 사이에 밑줄 ( "my_message")을 사용하고 다른 사람들은 대문자 ( "myMessage")로 구분하기를 원합니다.

나는 종종 다른 사람들과 함께 거대한 JavaScript 라이브러리를 사용하고 있으므로 함수와 변수 (함수 내부의 개인 변수 제외)는 "guestbook_message"와 같이 충돌을 피하기 위해 서비스 이름으로 시작해야합니다.

간단히 말해서, 영어, 소문자, 잘 구성된 변수 및 함수 이름이 나에게 바람직합니다. 이름은 짧지 않고 존재를 설명해야합니다.


2
"함수와 변수 (함수 내부의 전용 변수 제외)는 충돌을 피하기 위해 서비스 이름으로 시작해야합니다 . "이 문장은 정확하지 않습니다 . 여러 개의 자바 스크립트 프레임 워크를 통해 블리드되지 않는 "네임 스페이스"기능과 객체를 올바르게 가질 수 있습니다. MIX11에서이를 달성하는 방법에 대한 아주 좋은 프리젠 테이션이 있었다 channel9.msdn.com/Events/MIX/MIX11/OPN08
크리스 Marisic
당사 사이트를 사용함과 동시에 당사의 쿠키 정책개인정보 보호정책을 읽고 이해하였음을 인정하는 것으로 간주합니다.
Licensed under cc by-sa 3.0 with attribution required.