FRONTEND/Javascript

변수 선언 방법과 차이 (let / var / const)

1224minutes 2022. 7. 18. 11:40

1. let

let x; // x라는 변수를 생성 (선언)//
let x = 'watch' //x라는 변수를 생성하고, 'watch'라는 값을 할당//
let x = 'apple', y = 10, z = 'knife';//쉼표를 사용해 여러 변수 선언도 가능하지만 권장하는 방법은 아닙니다. //

가독성을 위해 한 줄에는 하나의 변수를 작성해야함.

let x= 'apple';
x = '25'; // 값이 변경됨.

값을 변경할 수 있음.

let x = 'apple';
let 'fruit'
apple = fruit; 
// x의 'apple' 값을 knife에 복사. apple = fruit

하나의 변수에 지정된 값을 다른 변수에 복사해줄 수 있음.

사용시 주의점

1) 변수는 한 번만 선언해야 함.

같은 변수를 여러 번 선언하면 에러 발생

2) 여러 단어를 조합하여 변수명을 만들 땐 카멜 표기법(camelCase) 준수.

단어를 차례대로 나열하면서 첫 단어를 제외한 각 단어의 첫 글자를 대문자로 작성. ex. myVeryLongName
이때 변수명에 문자와 숫자, 기호 $와 _(언더바)만 들어갈 수 있음. - 그냥 하이픈은 안됨.

3) 첫 글자는 숫자가 될 수 없음.

1_first 이런거 안됨.

4) 영문의 대, 소문자 구별함.

apple와 AppLE은 서로 다른 변수

5) 예약어(reserved name) 목록에 있는 단어는 변수명으로 사용할 수 없음.

let, return ... let let = 'apple' 안됨.

6) 변수명은 간결하고 명확하면서, 어떤 값이 할당되는지에 대해서 이해가 가능하도록 지어줘야 함.

(1)userName 이나 shoppingCart처럼 사람이 읽을 수 있는 이름을 사용.

(2) 명확하게 쓰임이 정의되지 않거나 하는 경우 빼고는 줄임말, a, b, c와 같은 짧은 이름은 피함.

(3) 최대한 서술적이면서 간결하게 명명.
data와 value는 나쁜 이름의 예시로써 아무것도 설명이 담겨있지 않음.
코드 문맥상 변수가 가리키는 데이터나 값이 아주 명확할 때에만 이런 이름을 사용하고, 소속된 팀의 규칙을 확인하고 따르도록 함.

2.var

var x; // x라는 변수를 생성 (선언)//

var는 let과 거의 비슷하지만 미묘한 차이 있음. var는 오래된 방식.

3. const

변화하지 않는 변수를 선언할 때 사용함.

const colorOfBlood = 'red'

기억하기 힘든 값을 변수에 할당해 별칭으로 사용하는 경우가 일반적.
대문자와 밑줄로 구성된 이름으로 명명
(ex. COLOR_RED)

const COLOR_RED = "#F00";
// 웹에서 사용하는 색상 표기법인 16진수 컬러 코드 red 컬러인
'#F00'이라는 값을 COLOR_RED라는 변수에 할당해줌.