[Javascript 공부] 1. 변수

설강·2020년 8월 2일
0

javascript

목록 보기
1/8
post-thumbnail
post-custom-banner

1. 변수

변수는 어떠한 이름의 보관함을 하나 생성해서
그 보관함에 어떠한 데이터를 담아 놓는 공간이다.

이것을 왜 쓸까?
아래와 같은 경우를 보자

console.log('안녕하세요');
console.log('안녕하세요');
console.log('안녕하세요');
console.log('안녕하세요');
console.log('안녕하세요');

vs

let str = '안녕하세요';
console.log(a);
console.log(a);
console.log(a);
console.log(a);
console.log(a);

과연 어느 것이 더 타이핑을 적게 할까?
그리고 안녕하세요가 아닌 잘가세요라고 바꾸려면
위의 것은 전부다 바꿔줘야하지만
아래의 것은 let str = '안녕하세요' 이 부분만 바꿔주면 된다.

이렇게 왜 변수를 사용해야 하는지에 따라서 알아보았고 이를 사용하는 방법은

let <변수 이름> = <>;

//ex)
let num = 1; //num이라는 이름의 보관함을 만들고 1이라는 숫자 값을 넣어놔라

위와 같은 방법으로 사용하면 되겠다.
그리고 let이라는 변수 선언 키워드 뿐만 아닌 다른 변수 선언 키워드들도 있다.

자바스크립트에서 변수 선언 키워드는 총 3가지가 있다.

  • var
  • let
  • const

그리고 이 3가지의 키워드에 대해 알아 보도록 하자.

1-1 "val"

var 키워드를 사용하여 변수 선언 하는 방법은 아래와 같다.

var str = 'hello velog';

이 키워드를 사용하여 변수 생성시 특이 점은

for(var i = 0; i < 10; i++) {
    console.log(i); //0 ~ 9
}
console.log(i); //10

자바스크립트 배우기 이전에 코딩을 배워왔던 사람이면
마지막 console.log(i)에서 이상한 점을 느꼈을 것이다.

보통 반복문에서 선언한 변수는 반복문이 끝나고 난 이후에는
해당 변수는 메모리에서 해제되어 사라지는걸로 알고 있을건데
var 키워드를 사용하여 변수 선언시에는 저렇게 남아 있다.

이 변수의 유효한 범위를 알기 위해서 아래와 같이 코딩해보았다.

function repeat(){
  for(val i = 0; i < 3; i++);
  console.log(i); // 3
}

function wow(){
  var wow = 'wow';
}
console.log(wow); //[Error] wow is not defined

결과로 보이듯 var 키워드로 생성한 변수의 유효 범위는
함수내에서만 유효 하다는 것을 알 수 있다.

1-2 "let"

let 키워드는 일반적인 변수랑 하는 역할이랑 같다.
varlet의 차이점은 유효범위에 따른 차이인데
이 코드를 보면 확실히 알 수 있다.

for(var i = 0; i < 3; i++);
console.log(i) // 3

for(let j = 0; j < 3; j++);
console.log(j) // [Error] j is not defined

이렇듯 let으로 선언한 변수는 선언한 스코프({}의 내부)내에서만
유효하다는 것을 알 수 있다.

1-3 "const"

const 키워드는 다른 변수 선언 키워드들과 다른 특징은

  • 변수 생성시 무조건 값을 넣어 할당한다.
  • 한번 생성하면 값을 더 이상 바꿀 수 없다.

아래 코드는 잘못된 작성법에 대한 내용이다.

const a; //Missing initializer in const declaration

const a = 1;
a = 2; //Assignment to constant variable

오류가 난것을 보고 알 수 있듯이
해당 키워드를 사용하여 변수를 생성을 하려면
무조건 값을 넣고 할당하고
할당하면 값을 바꾸려고 하면 안된다.

profile
Be a Full Stack Developer
post-custom-banner

0개의 댓글