본문 바로가기
언어/Javascript, Typescript

[js] 변수명 표기법 (var, let, cosnt)

by minhyeok.lee 2023. 2. 4.
반응형

javascript에서 변수명 표기법

 

변수명이 해당 변수를 쉽게 설명할 수 있게 하려면 보통 여러 단어로 이뤄질 가능성이 높다.

이때 사용하는 두가지 방법으로 카멜케이스(camelCase) 와 스네이크 케이스(snake_case) 가 있다.

 

변수명은 몇가지 제약사항을 제외하고 자유롭게 작명할 수 있다.

하지만 일정한 규칙없이 변수명을 만들어가다보면 수 많은 변수를 사용하는 코드 내에서 혼란스럽고, 유지보수에 어려움을 겪을 수 있다.

이러한 점을 극복하기 위해 대표적으로 카멜 케이스와 스네이크 케이스를 사용한다.

 

카멜 케이스 (camelCase)

var camelCase;

let userLevel = 1;

const userTeamPower = 1;

 * 단어와 단어 사이를 대문자로 구분하여 사용한다. (단어와 단어 사이에 대문자(혹)이 있다고 해서 camelCase)

 

스네이크 케이스 (snake_case)

var snake_case;

let user_level = 1;

const user_team_power = 1;

 * 단어와 단어 사이를 '_'로 구분하여 사용한다. (단어와 단어 사이에 뱀이 있다고 해서 snake_case)

 

이 두가지(카멜, 스네이크 케이스)는 자바스크립트 뿐만 아니라 모든 프로그래밍 언어에 유용한 규칙이다.

 

이외에 규칙들

대문자와 소문자는 서로 구별된다.

let apple;
let APPLE;

위 두 변수는 서로 다르다.

 

let 123abc; // 출력값: SyntaxError: Invalid or unexpected token

변수명은 숫자로 시작하면 안된다.

 

let my-name; // 출력값: SyntaxError: Unexpected token '-'

하이픈 '-'은 변수명에 올 수 없다.

 

예약어 목록에 있는 단어는 변수명으로 사용할 수 없다.

이 단어들은 자바스크립트 내부에서 이미 사용 중이기 때문이다.

let let = 5; // 출력값: SyntaxError: let is disallowed as a lexically bound name

'let'을 변수명으로 사용할 수 없으므로 에러가 발생한다.

 

let return = 5; // SyntexError: Unexpected token 'return'

'return'을 변수명으로 사용할 수 없으므로 에러가 발생한다.

 

* 예약어 목록 링크

https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Lexical_grammar#keywords

 

Lexical grammar - JavaScript | MDN

This page describes JavaScript's lexical grammar. JavaScript source text is just a sequence of characters — in order for the interpreter to understand it, the string has to be parsed to a more structured representation. The initial step of parsing is cal

developer.mozilla.org

 

* 중요:

1. 변수명은 간결하고 명확하게 지어 변수가 담고 있는 값이 무엇인지 실제로 돌려보지 않고 알 수 있어야 한다.

2. 변수명만 봐도 프로그램에 대해 모르고 코드를 처음보는 사람이 이게 무슨 변수인지 알 수 있게 지어야 한다.

3. 사람이 읽을 수 있는 단어를 사용하는 것이 좋다.

4. x, y, a 등 명확하게 파악할 수 없고 짧은 이름은 피해야 한다.

5. 최대한 서술적이고 간결하게 명해야함_data, value 등은 간결하지만 무슨 data인지 value인지 알 수 없어 명확하지 않다.

6. 혼자 프로젝트를 하는게 아니라면 소속된 팀의 규칙에 따라 변수 명을 지어야 한다.

 

결론:  변수명은 카멜케이스 혹은 스네이크 케이스로 소속된 팀에 맞춰 간결하고 명확하게 누구나 알아볼 수 있게 명시해야 한다.

반응형

'언어 > Javascript, Typescript' 카테고리의 다른 글

[js] Object(json)에서 key, value값 추출  (0) 2023.02.09
[js] 빈 값을 가진 json key 제거  (0) 2023.02.08
[js] const, let  (0) 2023.02.04
[js] var, let  (0) 2023.02.04
[js] Nullish coalescing operator(??)  (0) 2023.02.03

댓글