티스토리 뷰

개발공부/🟨 JavaScript

[JS] 식별자 (Identifier)

2023. 4. 9. 21:25

 

 

✅ 자바스크립트에서 식별자(Identifier)란?

 

코드 내의 변수, 함수, 혹은 속성을 식별하는 문자열이다.

 

즉 변수, 함수, 속성 명을 지을 때 사용하는 이름이다.

let age = 31

function setAge() {}

const o = {
    day: 6,
}


// age, setAge, o, day가 식별자

 

 

- 대소문자를 구별하며 유니코드 글자, $, _, 숫자(0-9)로 구성할 수 있지만, 숫자로 시작할 수는 없다.

- 공백문자는 사용할 수 없다.

- 자바스크립트 예약어(if, else, for 등..)는 사용할 수 없다.

- 길이 제한은 없으나 통상적으로 길게 쓰지는 않는 편이다.

- 식별자는 코드의 일부이지만 문자열은 데이터이기 때문에 식별자와 문자열은 다르다.

- 식별자를 문자열로 변환하는 방법은 없지만, 문자열을 분석해서 식별자로 사용할 수 있는 경우는 있다.

 

 

문자열이 식별자가 될 수 있는 경우의 예시를 보자.

const o = {
    day: 6,
    ['young']: '강영현'
}

o.young;	// 접근가능.

 

['young']의 'young'은 문자열 데이터이다. 하지만 위의 코드에서 보면 데이터가 식별자화될 수 있다는 것을 알 수 있다.

반대로 식별자가 데이터화될 수는 없다.

 

위와 같이 데이터로 식별자를 표현하는 방식을 사용하면 식별자 명명규칙을 따르지 않아도 된다.

const o = {
    day: 6,
    ['93k young']: '강영현'		// 공백가능, 숫자로 시작하기 가능
}

 

그렇지만 명명규칙을 따르지않은 속성명에 접근할 때는 []를 이용한 속성명 접근 방법을 사용해야한다.

o.93k young		// 접근 불가

o['93k young']		// 접근 가능

 

 

 

 

 

 

✅ 식별자를 작성할 때 관습적인 부분들

 

- 상수는 대문자로 이름을 짓는 것을 선호한다.

const AGE = 31;

 

 

- 이름이 길어질 때는 스네이크 케이스보단 카멜케이스를 많이 쓰는 편이다.

// 스네이크 케이스
function get_my_favorite_band() {}

// 카멜 케이스
function getMyFavoriteBand() {}

 

 

 

 

 

 

 

참고자료

🔗 [패스트캠퍼스] 김민태의 프론트엔드 아카데미 : 제1강 JavaScript&TypeScript Essential

🔗 [MDN] 식별자

반응형

'개발공부 > 🟨 JavaScript' 카테고리의 다른 글

[JS] Parallax Scrolling 구현하기  (0) 2024.04.18
[JS] 값(value)  (0) 2023.04.18
[JS] 프로토타입 (Prototype)  (0) 2023.02.19
[JS] 자바스크립트 비동기 처리  (0) 2023.01.29
[JS] 호이스팅 (Hoisting)  (0) 2023.01.18
프로필사진
개발자 삐롱히

프론트엔드 개발자 삐롱히의 개발 & 공부 기록 블로그