Scope(let, const, var)

jivyyyy·2020년 7월 30일
0

스코프(Scope)

어떤 변수들에 접근할 수 있는지를 정의하는 범위로서 전역스코프와 지역스코프가 있다.

전역스코프(Global Scope)

함수 바깥이나 중괄호({})밖에 선언된 경우로서 전역변수를 선언하게 되면 코드 모든 곳에서 해당 변수를 사용할 수 있게 된다.

하지만 전역스코프에 전역변수를 선언할 수 있다고 해도 추천되지는 않는다. 코드가 길어지다 보면 변수의 이름이 충돌하는 경우가 생길 수 있기 때문이다. 충돌하는 경우에도 변수를 const나 let 을 사용해서 선언했다면 에러가 발생했음을 알 수 있지만 var를 이용했다면 두번째 변수가 첫번째 변수를 덮어쓰게 되고, 디버깅이 어려워지므로 이런식으로 사용해서는 안된다.

지역스코프(Local Scope)

코드의 특정부분에서만 사용할 수 있는 변수들을 지역변수라 하고, 이런 변수들은 지역스코프에 있다고 할 수 있다.

자바스크립트에서는 두가지의 지역변수가 존재한다.

  • 함수스코프(Function Scope) :

함수 내부에서 변수를 선언하면, 그 변수는 선언한 변수 내부에서만 접근이 가능하다. 함수 바깥에서는 접근할 수 없다.

  • 블록스코프(Block Scope)

중괄호({})내부에서 const 나 let으로 변수를 선언하면, 그 변수들은 중괄호 블록 내부에서만 접근이 가능하다.

전역변수와 지역변수가 메모리에 미치는 영향

전역변수의 경우 코드가 컴파일 될때 메모리가 확정되며 웹 페이지가 닫혀야지만 메모리에서 삭제된다.
변수의 선언 = 메모리 라고 볼 수 있는 것이다 .따라서 전역변수를 무분별하게 선언하고 사용하면 메모리 누수가 발생하게 되어 어플리케이션 성능의 문제가 생길 수 있다. 따라서 쓸데없는 변수의 선언을 피하는 것이 좋다.

함수 호이스팅(function hoisting)과 스코프(scope)

함수가 선언식으로 선언되는 경우, 현재 스코프의 최상단으로 호이스팅된다.
이와같이 순서가 함수의 호출, 선언 순으로 작성되더라도 호출이 가능하다.

반면 함수가 표현식으로 선언되는 경우, 함수는 현재 스코프의 최상단으로 호이스팅되지 않는다.

이렇게 두 방식이 다르게 작용되기 때문에 함수 호이스팅은 혼란스러움을 줄 수 있어 사용이 권장되지 않는다. 언제나 함수를 호출하기 전에 선언하는 습관을 들이자.

ES6에서 let 이 등장한 이유

  • let 과 var 의 차이

1초 간격으로 0, 1, 2.. 가 나오는 것이 아니다. for 문이 한번에 다 돌고 난 순간부터 1초를 재는 것이기 때문에 한번에 숫자가 다 나오게 된다.

let 대신 var 를 사용하면 어떻게 될까?

어째서 이런 결과가 나올까?

  • var = 함수 스코프를 갖는다.
  • let = for문으로 지정된 블록영역(중괄호 내)의 스코프를 갖는다.

그래서 var로 선언한 경우는 사실상 아래의 코드와 같은 결과를 갖게 된다.

profile
나만의 속도로

0개의 댓글