2020. 7. 30. 14:04ㆍProgramming Languages/JavaScript
변수(Variable)는 변할 수 있는 데이터를 말합니다. let과 var로 선언할 수 있지만 let을 사용하기를 추천드립니다.
선언은 아래와 같이 할 수 있습니다.
let x = 10;
x = 15;
alert(x);
위와 같이 작성하면 x의 초기화는 10으로 되었지만 후에 x에 15를 할당하고 15가 출력되는 것을 볼 수 있습니다.
한 줄에 여러 변수를 선언할 수도 있습니다.
let name = "Steve", age = 24, city = "London";
alert(age); // 24
하지만 이렇게 한 줄에 여러 변수를 선언하는 것은 가독성을 해치기 때문에 한 줄에는 하나의 변수만 선언하는 것을 권장합니다. 여러 줄로 변수를 작성하는 것에는 방법도 여러 가지가 있습니다.
let name = "Azir";
let age = 32;
let city = "Shurima";
let name = "John",
age = 33,
city = "Seoul";
let name = "Ashe"
, age = 22
, city = "Freljord"
모두 쓰는 방법에만 차이가 있는 것이고, 같은 변수가 선언된다는 점에서는 모두 같습니다. 각자 취향이나 팀에 맞춰서 사용하면 될 것 같습니다.
변수의 이름을 만드는 데에는 몇 가지 규칙이 있습니다. 그 규칙은 다음과 같습니다.
- 변수명에는 오직 문자, 숫자, 그리고 기호 $와 _(underscore)만 올 수 있습니다.
- 첫 글자는 숫자가 될 수 없습니다.
// 잘된 변수 선언
let $ = "Dollar";
let _ = "Underscore";
// 잘못된 변수 선언
let 1_is_one = 1; // 변수는 숫자로 시작할 수 없음
let my-love; // 하이픈은 변수 선언에 불가능
이외에도 let, const, class 등 과 같은 예약어로도 변수를 선언할 수 없습니다.
예약어는 JavaScript에서 이미 내부적으로 사용되고 있기 때문입니다.
상수(Constant)는 한 번 값을 지정하면 변하지 않는 데이터를 말합니다. 상수의 선언은 const로 할 수 있습니다.
const greeting = "Hello";
greeting = "Hi"; // 에러 발생!!
상수로 선언된 greeting은 "Hello"로 지정됩니다. 두 번째 줄에서 greeting에 "Hi"를 선언하는 것은 상수를 바꾸려고 하기 때문에 에러가 발생합니다.
상수는 보통 기억하기 힘든 고정된 값을 만들 때 사용합니다. 예를 들어 원주율(3.141592), RGB 값 등이 있습니다.
const PI = 3.141592;
const BLACK = "#000000";
const WHITE = "#FFFFFF";
그렇다면 대문자 상수와 소문자 상수의 차이는 뭘까요?
대문자 상수는 값이 이미 정해진 값을 지정할 때 주로 사용하고, 소문자 상수는 런타임에서 값이 할당되지만 그 이후로 변하지 않는 값을 지정할 때 주로 사용합니다. 예를 들어 사용자의 id를 입력받을 때를 예로 들 수 있겠네요.
const userId = prompt("당신의 ID를 입력하세요");
한 번 정해지면 그 뒤로 값이 바뀌지 않는 값은 소문자 상수로 지정합니다.
바람직한 변수명
변수명은 간결하고, 명확해야 합니다. 변수명을 봤을 때 이 변수가 무엇을 담고 있는지 의미를 쉽게 파악할 수 있는 이름이 바람직한 변수명이라고 할 수 있습니다. 아래와 같은 규칙이 바람직한 변수명을 짓는 데 도움을 줍니다.
- userId 나 todayWeather 같이 사람이 읽을 수 있도록 만듭니다.
- 짧은 변수명은 피합니다.(a ,b, c, str 등)
- 최대한 서술적이고 간결하게 작성합니다. data나 value같은 변수명은 매우 좋지 않습니다. 어떤 data인지 어떤 value인지 알 수 없기 때문입니다.
- 자신이 만든 규칙이나 팀의 규칙을 따릅니다. 문서를 document라고 부르기로 했다면 newPaper나 currentScript라고 쓰지 않고 newDocument, currentDocument로 작성합니다.
'Programming Languages > JavaScript' 카테고리의 다른 글
[JavaScript] 함수(Function) (0) | 2020.08.02 |
---|---|
JavaScript 기초 - 형변환 (0) | 2020.07.31 |
JavaScript 기초 - 자료형 (0) | 2020.07.30 |
JavaScript 기초 - 구문 작성, 주석 (0) | 2020.07.30 |
JavaScript 기초 정리 - 1. 역사와 현재, 미래 (0) | 2020.07.30 |