이 글은 모던 자바스크립트 튜토리얼 2장 4 를 읽고 정리한 글입니다.
변수는 데이터를 저장할 때 쓰이는 '이름이 붙은 저장소'입니다.
SNS 앱을 구축하는 경우 사용자의 이름이나 정보를 저장할 때 변수를 사용합니다.
자바스크립트에선 var, let, const 키워드를 사용해 변수를 생성합니다
let message;
message = 'Hello'; //문자열을 저장합니다.
console.log(message); //변수에 저장된 값을 보여줍니다.
한줄에 여러 변수를 선언하는 것도 가능합니다.
let user = 'John', age = 25, message = 'Hello';
코드가 짧아 보이긴 하지만 권장하는 방법은 아닙니다. 가독성을 위해 한 줄에는 하나의 변수를 작성해주세요.
let user = 'John';
let age = 25;
let message = 'Hello';
var 키워드를 사용하여 변수를 생성할 수 있습니다.
var message = 'Hello';
하지만 var는 '오래된' 방식입니다. 미묘한 차이점은 추후에 자세히 다루겠습니다.
'상자'안에 데이터를 저장하는데, 이 상자에는 특별한 이름표가 붙어있다고 상상하면 좀 더 쉽게 이해할 수 있습니다.
예를 들어, 변수 message 는 message 라는 이름표가 붙어있는 상자에 "Hello!" 라는 값을 저장한 것이라고 생각할 수 있습니다.
변수의 데이터는 어떤 값이든지 넣을 수 있고 얼마든지 값을 변경할 수 있습니다.
let message;
message = 'Hello!';
message = 'World!'; // 값이 변경되었습니다.
alert(message);
변수 두 개를 선언하고, 한 변수의 데이터를 다른 변수에 복사할 수도 있습니다.
let Hello = 'Hello world!';
let message;
// Hello의 'Hello world' 값을 message에 복사합니다.
message = Hello;
// 이제 두 변수는 같은 데이터를 가집니다.
alert(Hello); // Hello world!
alert(message); // Hello world!
변수를 두 번 선언하면 에러가 발생합니다.
let message = "This"; // 'let'을 반복하면 에러가 발생합니다. let message = "That"; // SyntaxError: 'message' has already been declared
자바스크립트에선 변수 명명 시 두가지 제약사항이 있습니다.
다음은 유효한 변수명의 예시입니다.
let userName;
let test123;
여러 단어를 조합하여 변수명을 만들 땐 카멜 표기법이 흔히 사용됩니다. 카멜 표기법은 단어를 차례대로 나영하면 첫 단어를 제외한 각 단어의 첫글자를 대문자로 작성합니다.
변하지 않는 변수를 선언할 땐 const를 사용합니다.
상수로 선언된 변수는 재할당할 수 없으므로 변경하려고 하면 에러가 발생합니다
const myBirthday = '18.04.1982';
myBirthday = '01.01.2001'; // error, can't reassign the constant!
변숫값이 절대 변경되지 않을 것이라 확신하면, 값이 변경되는 것을 방지하기 위해 const를 사용해 변수를 선언하는 것이 좋습니다.