[JavaScript] 9. 변수 선언하기 (let)

Eden·2022년 9월 11일
0

Javascript

목록 보기
27/33
post-thumbnail

9. 변수 선언하기 (let)

프로그램을 만들 때는 잠깐 동안 특정한 값을 저장해야 하는 상황이 자주 발생한다. 이때 사용하는 것이 변수다.

let total = 5000 + 8000 + 10000 + 9000;
<undefined
//이 때 =은 같다는 의미가 아니라, 대입.할당했다는 의미로 쓰인다.

//콘솔에 total을 입력하면 32000이 출력된다.
total;
>32000

//변수의 값을 콘솔에 출력할 수 있다.
console.log(total);
>32000
<undefined

total처럼 값을 저장하고, 저장한 값을 불러올 수 있게 하는 것이 변수(variable)이다. 변수를 만드는 행위를 선언(declaration)한다고 표현하므로 앞으로는 변수를 선언한다라고 한다.

변수를 만드는 방법은 let const var 세 가지가 있다.

변수를 만드는 형식

let 변수명 =;

let 다음에 선언하고자 하는 변수명을 적고, 그 뒤에 대입 연산자인 = 을 입력한다. 그 뒤에는 변수에 저장할 식을 입력한다.

let total = 5000 + 8000 + 10000 + 9000;
<undefined 

먼저 let으로 시작하는 명령을 선언문 이라고 한다. total은 변수명이다. 변수를 선언함과 동시에 값을 대입하는 행위를 초기화(initailization) 이라고 한다. 그래서 변수 선언은 항상 결과 값이 undefined로 출력된다.

변수 이름 짓기

let empty;
<undefined

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

이미 선언한 변수를 다시 선언하는 경우에는 에러가 발생한다. empty 두 개를 연달아 선언해보자.

let empty; let empty;
>Uncaught SyntaxError: Identifier 'empty' has already been declared

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

그리고 그 값을 바로 알아볼 수 있도록 자세하고 명확하게 지어야한다..!

한글, 한자, 특수기호, 이모티콘 등 변수명이 가능하지만 공용어인 영어로 지어주는 것이 좋다.

그런데,,

변수명으로 사용할 수 없는 단어도 있다. 바로 예약어(reserved word)라고 하는데, 예약어는 자바스크립트 프로그래밍을 할 때 각각 특정한 역할을 하기 때문에 변수명으로 쓰지 않는다.

예약어지만 변수명으로 쓸 수 있는 경우도 있고, 예약어가 아님에도 변수명으로 쓰지 못하는 경우도 있다. 프로그래밍하다가 만나는 예약어들을 피해서 변수명으로 지정하자!

변수 값 수정하기

변수는 변하는 자료형의 값을 저장하는 것을 의미한다. ‘변하는'. 한 번 저장한 값을 바꿀 수 있다는 뜻이다.

let change = '바꿔 봐';
>undefined
//change라는 변수를 선언하고 초기화했다. change 변수의 값을 바꿔보도록하자!
//바꾸는 방법은 변수명에 다시 대입연산자를 사용해서 새로운 값을 입력하면 된다.
change = '바꿨다;'
>"바꿨다"
console.log(change);
>"바꿨다"

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

change = undefined;
>undefined

change = null;
>undefined

두 방법 중에 틀린 방법은 없지만, null 을 사용하는 것을 추천한다! 동료 개발자에게 전달하는 메세지가 될 수도 있다!

변수 활용하기

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

//변수를 선언하고 초기화 했다.
let num = 5;
>5
//num 변수에 3을 더하면 어떻게 할 수 있을까?

//원래 있던 변수에 +3을 해주면 다시 num에 저장된다.
num = num + 3;
>8
//이렇게도 표현할 수 있다.
num += 3;
8

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

number -= 3;
number = number - 3;
//이 두식은 같은 의미다!

변수는 계산된 값을 저장할 때도 사용하지만, 중복을 줄이려고 사용하기도 한다.

console.log('엄청 긴 문자열입니다!!!!!!');
console.log('엄청 긴 문자열입니다!!!!!!');
console.log('엄청 긴 문자열입니다!!!!!!');
console.log('엄청 긴 문자열입니다!!!!!!');
console.log('엄청 긴 문자열입니다!!!!!!');
console.log('엄청 긴 문자열입니다!!!!!!');
console.log('엄청 긴 문자열입니다!!!!!!');
console.log('엄청 긴 문자열입니다!!!!!!');
.
.
.
console.log('엄청 긴 문자열입니다!!!!!!')

코드에서 같은 문자열이 반복되는 중인다. 만약 문자열의 길이가 수백 자가 된다면 하나하나 표현하기 어렵겠죠

let string1 = '엄청 긴 문자열 입니다!!!!!!'
console.log(string1);
console.log(string1);
console.log(string1);
console.log(string1);

컴퓨터를 사용하는 이유는 편리함을 위하는 일이기 때문에, 웬만한 일은 컴퓨터에게 맡기도록 하자!

상수 만들기

let 외에도 constvar 이 있다!

var은 variable, const는 상수(constant)의 줄임말이다. 변수와 상수는 어떤 차이가 있을까?

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

const string = ('엄청 긴 문자열입니다!!!!!!');
>undefined

string = 'Eden';
->Uncaught TypeError: Assignment to constant variable.

const의 값을 변경하려고 하면 에러 메세지가 뜬다.

const value2;

값을 안넣어도 에러가 난다. 나중에 다시 선언하지 못하기 때문이다.

var은 대부분 let이랑 비슷하다.

undefined Infinity let 은 자바스크립트에서 각자 역할이 있는 예약어다.

*1분 퀴즈

a와 b라는 변수에 어떠한 값이 들어있다. 두 변수의 값을 서로 바꿔보자!

힌트 두 값을 바꾸기 위해서는 변수 하나를 더 만들어야 한다.

let a = 10;
let b = 15;

let c = a;
<-undefined

a = b;
>15
b = c;
>10

*c = null;
//쓰지 않을 값..
profile
one part.

0개의 댓글