☭DEVELOPER/#4 자바스크립트

자바스크립트 | 레츠기릿 자바스크립트 10

조반짝 2024. 1. 12. 16:19
728x90
반응형

변수

값들으 일회성이기 때문에  프로그램을 만들 때는 잠깐 동안 특정한 값을 저장해야 하는 상황이 자주 발생한다,

이 때 사용하는 것이 변수이다. 


프로그램의 목적 : 현실의 것 > 컴퓨터에 넣음 > 현실문제 해결

 

더하기 연산자의 결과인 32000을 total이라는 이름으로 저장했다.

콘솔에 total을 입력하면 저장된 32000이 출력된다.

console.log(변수) 로 변수의 값을 콘솔에 출력할 수도 있다.

console.log : 화면에 그려주는 것

이렇게 total처럼 값을 저장하고, 저장한 값을 불러올 수 있게 하는 것이 변수(variable)이다.

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

 

let total = 5000 + 8000 + 10000 + 9000;

// + 연산자가 우선순위로 32000의 결과값이 먼저나오고
// = 오른쪽에 있는 32000을 total에 대입(할당)한다.

let 으로 시작하는 명령을 선언문이라고 한다.

total은 변수명이다. 대입 연산자보다 더하기 연산자의 우선순위가 높기 때문에 숫자를 더하는 식이 먼저 계산된다.

그리고 계산된 값 32000이 대입 연산자를 통해 total 변수의 값으로 저장된다.

변수를 선언함과 동시에 값을 대입하는 행위를 초기화(initalization)이라고 한다.

끝으로 변수 선언은 항상 결과값이 undefined로 출력된다.

 

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

내용물이든 상자로 예를 들면 상자에는 이름표가 붙어있고, 상자는 창고에 들어있다.

여기서 내용물이 값(32000)이고, 이름표가(total)이며 창고가 메모리다. 

사람이 창고에서 상자의 이름표를 보고 내용물을 찾듯이 개발자도 메모리에서 변수명으로 값을 가져올 수 있다.

상자를 만드는 것은 프로그램에서 변수 선언하는 것과 같다.

상자에 내용물을 넣는 것은 = 연산자를 사용하는 것과 같다.

 

undefined : 값을 대입하지 않은 변수를 입력하면 undefined가 출력된다.

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

 

이미 선언한 변수를 다시 선언하는 경우는 에러가 발생한다.

 

따라서 변수명이 겹치지 않도록해야한다.

 

  • 변수이름 짓기

변수명에는 특수문자 $ _ 만 사용이 가능하며 숫자로 시작해서는 안되며 문자 뒤에 사용은 가능하다.

한자와 한글, 유니코드까지도 변수명을 쓸 수 있다.

하지만 왠만하면 영어로 쓰는 것이 좋다.

띄어쓰기는 사용하며 안되며 쓰고 싶을 때는 camelcase 방식으로 사용한다.( GoodCode)

 

예약어지만 변수명으로 쓸 수 있는 경우도 있고, 예약어가 아님에도 변수명으로 쓰지 못하는 경우도 있다.

그리고 예약어를 사용하면 에러가 발생하기 때문에 변수를 선언할 때 에러를 확인해도 된다.

 

  • 변수 값 수정하기

변수는 변하는 숫자라는 의미지만, 실제로는 숫자 자료형 외에도 다양한 자료형의 값을 저장할 수 있다.

여기서 주목해야 할 부분은 '변하는'이다. 한 번 저장한 값을 바꿀 수 있다는 뜻이다.

 

change 라는 변수를 선언하고 초기화했다.

change 변수의 값을 바꿔보았다. 변수명에 다시 대입 연산자를 사용해서 새로운 값을 입력하면 된다.

값은 대입연산자를 사용했는데 결과값이 달라서 의문이 생길 수 있다.

이는 let 의 역할 때문이다.

let이 없을 때는 코드가 식이라서 대입한 값이 결과값으로 출력되지만, let이 옆에 붙는 순간 선언문이 된다.

여기서 문(statement)라는 개념이 나온다.

문은 식과 다르게 결과값이 없고 식의 자리에서 사용할 수 없다.

 

변수를 넣은 값을 비울 때도 있다.

이때는 두가지 방법이 있다. 

1. undefined를 대입하기

2. null을 대입하기

 

두 가지 모두 변수의 값을 빈값으로 바꾼다는 점은 동일하지만, undefined와 null 이 다른 값이기 때문에

다른 의미를 부여할 수 있다.

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

 

  • 변수활용하기

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

변수에 들어 있는 값을 다른 변수에 대입하는 방식이다.

이 코드는 수학적으로 보면 틀린 코드이다.

하지만 프로그래밍에서는 ==이나 ===이 비교연산자이고, =은 대입 연산자라는 것을 기억하자!!

대입 연산자는 산술 연산자보다 우선순위가 낮기 때문에 number 변수에 3을 더한 뒤, 그 값인 8을 number 에 대입하게 된다.

 

앞의 코드를 다음과 같이 축약할 수도 있다.

기존 number 변ㅅ의 값에 3을 더한 후, 결과값을 다시 number 에 대입한다.

비슷한 원리로 -=, /=, %= ,**= 연산자 등 도 있다.

 

number -= 3;
number = number - 3;

 

값을 사용할 때와 수정할 때 중복이 발생하는데 이를 막기 위해 다음과 값을 바꿀 수 있다.

추 후 코드에 수정사항이 생겼을 때 string1 변수의 값만 수정하면 변수를 사용하는 부분이 한번에 수정되어 모든 줄을 일일히 수정할 필요가 없다.

 

  •  상수(const)와 var

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

const는 상수(constant)의 줄임말이다. 

변수는 변하는 수 이다. 반대로 상수는 변하지 않는 수라는 뜻이다.

 

상수와 변수의 뜻을 살펴보면 완전히 반대 개념이라는 것을 알 수 있다.
그런데 왜 let 과 var, const 를 묶어 변수라고 통칭했을까?
const 는 엄밀히 말해 상수가 아니다.
const는 나중에 배우는 객체의 내부값에는 적용되지 않는다.

 

실수로 값을 수정하는 일을 막기 위해 상수를 사용한다.

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

const 도 식이 아니라 선언문이기 때문에 콘솔에 undefined 가 출력된다.

그리고 다른 값을 대입하면 에러가 발생한다. 하지만 값을 바꿀 수 없다는 뜻이 아니다. 

나중에 객체를 배울 때 값을 바꾸는 방법을 살펴보자!

 

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

 

  • var

var는 변수(variable)의 줄임말이다.

var로 변수를 선언하면 특별히 변수문(variable statment)이라고 한다.

선언 시 초기화하지 않으면 값에 undefine가 대입된다. 여기까지는 let과 상당히 비슷하다.

하지만 다른점은 기존에 선언했던 variable 변수를 다시 선언해도 에러가 발생하지 않는다.

이러한 특징 때문에 실수로 변수를 다시 선언하는 문제가 발생할 수 있다.

 또한 예약어나 다름없는 이름을 변수명으로 사용할 수 있다.

undefined, infinity, let은 자바스크립트에서 각자 역할을 하는 예약어이다.

이러한 이름을 변수명으로 쓰면 같은 코드를 보는 다른 개발자가 매우 헷갈릴 수 있다.

var 대신 let을 사용하면 에러가 발생해 해당 이름의 사용을 막는다.

 

** a와 b에 어떠한 값이 들어 있다. 두 변수의 값을 바꾸기 위해서는?

c 라는 임시 변수를 만들어서 거기에 a의 값을 임시로 저장하고 b값을 a로 바꾼다. 그리고 기존 a값이 들어있던 c에 b를 넣어준다.

 

728x90
반응형