자바스크립트 - 변수

오늘은 변수와 간단한 문법에 대해 알아보자!

 

 

 

 

변수란 무엇인가?

→ 변수(Variable)는 (문자 혹은 숫자 같은) 값을 담는 컨테이너로 값을 유지할 필요가 있을 때 사용한다.

그리고 여기에 담긴 값은 다른 값으로 바꾸는 것이 가능하다.

 

그렇다면 선언은 어떻게 할 것인가?

 

자바스크립트에서 변수는 var로 시작한다.

→ 여기서 var는 변수를 선언하겠다는 것을 의미!

 

var를 생략 할수도 있지만 이것은 유효 범위라는 것에 영향을 미친다. 

변수의 이름은 $, _, 혹은 특수 문자를 제외한 모든 문자로 시작할 수 있다.

 

var a = 1;
alert(a+1);  //결과: 2

 

변수 a에 1이 담겨지고, 1일 담긴 a와 숫자 1을 더해 경고창에 2라는 값이 출력된다.

 

 

여기서 혹시 모르니, //(주석)과 ;(세미콜론)에 대해 알아보자!

 

// 은 주석(comment)으로 코드에 부가적인 설명을 쓰거나 사용하지 않는 코드를 비활성화시키기 위해서 사용한다.

// 뒤에 따라오는 내용은 해석되지 않는다.

 

;(세미콜론)은 하나의 구문이 끝났음을 명시적으로 알려주는 기호이다.

a = 1; alert(a+1);

 

다음처럼, 한줄에 여러 구문을 사용하고 싶을 때, 세미콜론이 유용하다.

자바스크립트에서는 세미콜론을 생략할 수 있는데,

단, 이 경우 줄바꿈을 명령의 끝으로 간주하게 되므로 되도록이면 ;(세미콜론)을 붙히는 습관을 가지는 게 좋다.

 

 

또 변수는 값이 꼭 숫자만 올 수 있는 것이 아니라 문자나 문자열도 올 수 있다.

var chr = 'C'
alert(chr + "oding") // 결과 : Coding

var first = "coding";
alert(first+" everybody"); // 결과: coding everybody

var a = 'coding', b = 'everybody';
alert(a);
alert(b); // 결과: codingeverybody

 

 

만약 변수가 없다면??

 

 

예를 들어서, 

alert(100+10);
alert((100+10)/10);
alert(((100+10)/10)-10);
alert((((100+10)/10)-10)*10);

100에 10을 더하고, 10을 나눈 후에 다시 10을 빼고 거기에 10을 곱해야 한다.

이럴 경우, 갑자기 100이라는 숫자를 모두 다른 값으로 변경하고 싶을 때,

우리는 하나 하나 값을 바꿔야 한다.

 

 

그렇다면 변수를 적용해보자.

 

a = 100;
a = a + 10;
alert(a); // 결과: 110
a = a / 10;
alert(a); // 결과: 11
a = a - 10;
alert(a); // 결과: 1
a = a * 10;      
alert(a); // 결과: 10

위의 코드에서 첫번째 줄의 100을 다른 숫자로 바꾸면 나머지 로직에 대입되는 변수의 값이 모두 바뀐다.

수정해야 할 코드가 적다는 것은 그만큼 해야 할 일이 줄어든다는 의미고,

그 과정에서 유지보수가 쉽고, 버그가 발생할 가능성을 낮출 수 있다.