[Let's Get IT 자바스크립트 프로그래밍] 2장 기본 문법 배우기 - 변수

변수명짓기
변수의 값 수정하기
변수 활용하기
상수 만들기

변수

특정한 값을 저장하고 저장한 값을 불러올 수 있게 하는 것

변수를 만드는 행위는 선언(declaration)한다고 표현한다.

변수를 만드는 방법 세 가지 let, const, var

// 변수 선언 방식
let 변수명 = 식;

let으로 시작하는 명령을 선언문이라고 하며, 변수를 선언함과 동시에 값을 대입하는 행위는 초기화(initialization)라고 한다.

변수의 이름과 값은 컴퓨터의 메모리에 저장된다.

let empty;
//undefined

이렇게 변수를 선언할 때 값을 대입하지 않으면 기본값인 undefined가 된다.

변수명 짓기

변수명은 변수의 값이 무엇인지 알려 주는 역할을 하기 때문에 자세하기 짓기를 권장함.

let banana = 'apple';

이처럼 변수명은 banana(바나나)인데 저장된 값이 apple(사과)이면 사용자가 헷갈릴 수 있다.

또한 아무 의미 없는 변수명을 사용하면 저장된 값이 무엇인지 추정하기가 매우 어려워진다.

변수명을 지을 때 제약사항이 있다.

특수문자는 $(달러), _(언더바)만 사용할 수 있으며, 숫자로 시작해서는 안된다.

let er^ror;
// Uncaught SyntaxError: Unexpected token '^'
let 2error;
// Uncaught SyntaxError: Invalid or unexpected token

$와 _를 제외하고 다른 특수문자가 들어가거나 숫자로 시작하는 변수명을 입력하면 에러가 발생한다.

이를 제외하면 한글이나 한자, 유니코드까지도 변수명으로 쓸 수 있다.

하지만, 내가 만든 프로그램이 전 세계에서 널리 쓰이길 원한다면 공용어인 영어로 변수명을 짓는 게 좋다.

변수명으로 사용할 수 없는 단어도 있다. 이를 예약어(reserved word)라고 하는데, 예약어는 자바스크립트 프로그래밍에서 특정한 역할을 하므로 변수명으로 쓰지 않습니다.

let let;
// Uncaught SyntaxError: let is disallowed as a lexically bound name
let var;
// Uncaught SyntaxError: Unexpected token 'var'

변수의 값 수정하기

let change = '바꿔 봐';

change = '바꿨다.';

console.log(change);
// 바꿨다.

let이 없을 때는 코드가 식이라서 대입한 값이 결괏값으로 출력되지만, let이 앞에 붙는 순간 선언문이 됩니다. 여기서 문(statement)은 식과 다르게 결괏값이 없고 식의 자리에 사용할 수 없습니다.

변수의 넣은 값을 비울 때는 undefined를 대입하거나 null을 대입하여 비울 수 있습니다.

change = underfined;

change = null;

많은 개발자가 null을 대입해 값을 의도적으로 지웠다는 의미를 부여합니다.

변수 활용하기

변수를 다른 변수에 대입할 수도 있습니다.

let string = 'Hello, variable';

let string2 = string;

string2;
// "Hello, variable"

string 변수의 값이 string2에도 대입된 모습입니다.

자기 자신을 대입할 수도 있습니다.

let number = 5;

number += 3;
// 8

기존 number 변수의 값에 3을 더한 후, 결괏값을 다시 number에 대입합니다. 비슷한 원리로 -=, *=, /=, %=, **= 연산자도 있습니다.

변수는 계산된 값을 저장할 때도 사용하지만 중복을 줄일 때도 사용합니다.

코드에서 같은 문자열이 반복된다면 중복되는 문자열을 만들어서 코드를 줄일 수 있습니다.

let string = '문자열입니다.';

console.log(string);
console.log(string);
console.log(string);

수정할 때도 변수의 값만 수정하면 됩니다.

 

상수 만들기

let 외에도 변수를 선언하는 예약어로 const와 var가 있습니다.

const는 상수(constant)의 줄임말로, 변하지 않는 수라는 뜻입니다.

하지만, 객체의 내부 값에서는 변하는 경우도 있습니다.

const value = '상수';

value = '바꿀 수 없습니다.';
// Uncaught TypeError: Assignment to constant variable.

이렇게 상수로 변수를 만들게 되면 수정되지 않음이 보장되기 때문에 더 안전하게 코딩할 수 있습니다.

 

const로 선언한 상수는 다시 선언할 수 없습니다. 

const value = '상수';

const value = '다시 선언할 수 없습니다.';
// Uncaught SyntaxError: Identifier 'value' has already been declared

또한, 한번 값을 대입하면 다른 값을 대입할 수 없다는 특성 때문에 상수 선언 시 초기화(선언과 동시에 값을 대입하는 것) 하지 않으면 에러가 발생합니다.

const value;
// Uncaught SyntaxError: Missing initializer in const declaration

1분 퀴즈
a와 b라는 변수에 어떠한 값이 들어 있습니다. 두 변수의 값을 서로 바꿔 보세요.
힌트 : 두 값을 바꾸기 위해서는 변수 하나를 더 만들어야 합니다.

정답 및 해설

let a = 10;
let b = 11;
let c = a;

a = b; // 11
b = c; // 10

// c라는 변수에 a의 값을 대입하고, a = b, b = c로 값을 변경해주게 되면 c에 있는 a 값이 b에게 저장된다.