[기초 이론] Variable, Constant

변수와 상수

변수(Variable)란 기본적으로 값(숫자, 텍스트 문자열 등)에 이름을 붙이는 것이다. 변수는 var, let 으로 구분되어 있으며 해당 키워드와 그 뒤의 이름으로 생성할 수 있다. 상수(Constant) 또한 변수처럼 이름을 붙인 값이지만, 변수와 달리 상수의 값은 바꿀 수 없다. 상수는 const 키워드와 그 뒤의 이름으로 생성할 수 있다. 변/상수 뒤에 등호(=, Equal Sign)를 붙여 원하는 값(Value)을 할당해준다.

 

근래 들어 var로 변수 선언하는 것은 최대한 지양하고 있으며, 변수는 let, 상수는 const로 고정하도록 한다.

상수

const a = 10;
const b = 2;

console.log(a + b); // 12
console.log(a - b); // 8
console.log(a * b); // 20
console.log(a / b); // 5
console.log(a ** b); // 100

// a = 100; < 불가능

기본적으로 쓰이는 상수는 변경할 수 없는 값을 일컫는다. 자세한 내용은 하단의 <변수 재할당>에서. 

변수

변수와 값

let love = 'best';
let best = 'love';
console.log(best); // love

왜 이런 값이 나올까? let 이라는 변수 뒤에 선언되는 것은 변수명, 그리고 등호 뒤에 할당되는 것은 값이기 때문이다. 즉, best 라는 변수명엔 'love'라는 문자값이 할당되어 있다는 걸 콘솔에 출력하는 것이다. 변수는 값을 포함하고 있다. 변수는 값 자체가 아니다. 변수는 값을 위한 컨테이너며 변수는 물건을 저장할  수 있는 작은 골판지 상자와 같다고 생각할 수 있다.

let number = 1;

let text = '1';

let boolean = true;

let array = ['first', 'second', 'third'];
console.log(array[0]); // > first

let object = {
    one: 1,
    two: 2,
    three: 3
};
console.log(object.one); // > 1

 

좀 더 심층적으로 

let a = 5;
let b = a; // let a = b라고 선언할 경우 이미 a는 선언되어 있다는 오류메세지가 뜬다.
console.log(b);

이런 코드가 있다. 콘솔에서 확인했을 때 어떤 값을 출력할까? JavaScript는 위에서 아래로 읽으니 b = a 이므로 a를 출력하게 될까? 답은 5다. a와 b는 변수이고 값은 5밖에 없기 때문이다. 

let a = 5;
a = b;
console.log(b);

갑자기 나는 어떻게든 a를 출력해보고 싶었다. 그럼 a에 b를 (아무튼) 재할당해보자.  하지만 이 방법도 실패할 수 밖에 없다. 콘솔엔 b가 정의되지 않았다는 오류메세지가 뜬다. 왜냐하면 a와 b는 둘 다 변수이고 변수를 출력하기 위해선 값을 포함하고 있어야하기 때문이다. 

let a = 5;
b = 'a';
a = b;
console.log(b);

a를 출력하고 싶다면 이렇게 값이 될 수 있는 문자(String)으로 할당한 뒤 콘솔에 출력하면 된다. 

변수 재할당

가끔 변수의 값을 변경하고 싶거나 필요한 경우가 있다. 그럴 땐 변수에 값을 재할당하면 되는데, 재할당이란 변수에 저장된 값을 다른 값으로 변경하는 것이다. 상수 예제에서 a와 b에게 숫자 10과 2를 할당해주며 콘솔에 간단한 사칙연산을 출력했지만 12와 3으로 업데이트 하고 싶다면? 하지만 상수는 변경할 수 없는 값이기 때문에 재할당이 불가능 하다. 재할당하기 위해선 변경할  수 있는 값인 변수를 이용해야 한다.

let user = 'sumin';
console.log(user); // > sumin
user = 'cheonsumin' 
console.log(user); // > cheonsumin

이렇듯 처음 let 으로 변수를 선언하고 변수 이름 user에 'sumin'이라는 문자, 즉 text를 할당했다. 정확히 String이라고 불리지만 다음에 다뤄보도록 하겠다. 그리고 let을 제외한 user에 'cheonsumin' 을 작성하면 user 에 값을 재할당하는 것이다. 마지막으로 JavaScript는 위에서 아래로 읽기 때문에 만약 아래와 같이 작성한다면

let user = 'sumin';
user = 'cheonsumin' 
console.log(user); // > cheonsumin

 'sumin'은 'cheonsumin'으로 덮어지므로 'cheonsumin'만 출력될 것이다.

이름에 대한 규칙

JavaScript에는 변수에 이름을 붙이는 규칙이 있다. 일반적으로

• 전 세계 타인이 이해할 수 있는 영어를 써야한다.
• 변수 이름 시작 부분에 밑줄을 사용하는 것은 굉장히 특별한 의미를 가지고 있으므로 일반적인 상황에선 쓰지 않는다.
• 변수 이름 시작 부분에 숫자를 사용하면 오류가 난다.
• 변수 이름은 대소문자를 구분하기 때문에 같은 문자라 하더라도 대소문자가 다르면 다른 변수로 인식한다.
• 변수 이름을 포함된 데이터를 직관적으로 이해할 수 있게 단일 문자 / 숫자 / 긴 구절을 지양한다.
• 변수 이름을 JavaScript 예약어로 사용하면 브라우저가 예약어로 인식하므로 오류가 생긴다.
• camelCase 명명법으로 작성 하는 법: 여러 단어를 하나로 묶고 첫 단어의 시작은 소문자를 사용하며, 그 다음 단어의 시작은 대문자로 사용한다.

결론

이렇게 변수와 상수에 대해 알아보았다. 기본적으로 JavaScript를 코딩할 때 상수 const를 쓰고 필요할 때만 let을 쓰되, var는 쓰지 않는다. 그리고 블로그를 보면 let과 const는 굳이 구분하지 않고 둘 다 변수로 통일되서 불리는 것 같다.