[Js] 변수

 

해당 포스팅은 "생활코딩"의 이고잉 님의 강의를 기반으로 올린 게시글 입니다.

상업적인 용도가 아닌, 개인 공부 정리 목적으로 올리는 글임을 미리 알립니다.

 

---

 

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

여기에 담겨진 값은 다른 값으로 바꿀 수 있다.

 

변수는 마치 (사람이 쓰는 언어인) 자연어에서 대명사와 비슷한 역할을 한다.

 

변수의 선언

JavaScript에서 변수는 var로 시작한다.

var은 변수를 선언하겠다는 것을 의미한다.

 

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

그렇기 때문에 var의 의미를 명확하게 이해하기 전까지는 var를 사용하는 것이 권장된다.

 

유효범위에 대해서는 뒤에서 살펴볼 것이다.

 

변수의 이름은 $, _, 혹은 특수 문자를 제외한 모든 문자로 시작할 수 있다. 다음 예제는 변수에 값을 대입한 예제다.

<script> 
	var a = 1;
    alert(a + 1); //2
    
    var b = 3;
    alert(b + 3); //6


</script>

/*

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

세미콜론
세미콜론(;)은 하나의 구문이 끝났음을 명시적으로 나타내는 기호다. 
다음처럼 한줄에 여러구문을 사용하고 싶을 때 세미콜론이 유용하다.
a = 1; alert(a+1);
JavaScript에서는 세미콜론을 생략할 수 있는데, 이 경우 줄바꿈을 명령의 끝으로 간주하게 된다.


*/

 

위 예시를 크롬 브라우저에서 실습해본다면 

 

다음과 같은 결과가 출력된다.

 

 

 

 

a 는 변수이기 때문에 값을 담을 수 있다.

 

 

값을 담는 그릇은 어떠한 값이 담기던 상관이 없기 때문에,

 

값을 변경하면 변경된 값이 저장된다.

 

 

변수안에는 어떠한 형태의 데이터도 담길 수 있다.

 

 

숫자뿐 아니라 문자도 가능하다.

 

문자를 변수안에 넣은 예제를 살펴보자.

 

<script>

    var first = 'coding';
    alert(first + 'everybody');

</script>

//처음 변수를 선언할 때만 var를 써서 선언 해주고, 이후엔 써주지 않아도 된다.

위와 같이 문자를 변수에 넣어 연산할 수도 있다.

 

 

 

Q. 그렇다면 변수는 도대체 왜 쓰는 걸까?

 

 

A. 변수는 코드의 재활용성을 높여준다. (좋은 코드를 만들기 위해 가장 중요한 키워드이다.)

 

 

예를들어서 100에 10을 더하고, 10을 나눈 후에 다시 10을 빼고 거기에 10을 곱해야 한다고 치자.

그리고 각 단계마다 그 결과를 출력해야 한다면 코드는 아래와 같을 것이다.

 

<script>

    alert(100+10);
    
    alert((100+10)/10);
    
    alert(((100+10)/10)-10);
    
    alert((((100+10)/10)-10)*10);
    
</script>

 

하지만 계산해야 할 값이 100이 아니라 1000으로 바뀌게 된다면

위의 코드를 모두 100 --> 1000 으로 수정해야 할 것이다.

 

이렇게 되면 코드의 효율성이 떨어지게 된다.

 

 

만약 이 코드를 변수를 사용한다면??

<script>

    a = 100;	

    a = a + 10;
    alert(a);

    a = a / 10;
    alert(a);

    a = a - 10;
    alert(a);

    a = a * 10;      
    alert(a);
    
</script>

 

위 코드와 같이 변수로 a의 값을 100으로 지정해 주었더라면

첫번째 줄의 100을 다른 숫자로 바꾸면 나머지 로직에 대입되는 변수의 값이 모두 바뀌게 된다!

 

수정해야 할 코드가 적다는 것은 그만큼 해야 할 일이 줄어든다는 의미고, 그 과정에서 버그가 발생할 가능성을 낮출 수 있다. 변수의 효용은 뒤에서 배우게 될 반복문, 조건문, 함수와 결합되면 더욱 더 중요해진다.