값 더 알아보기

const와 let의 차이

  1. let은 재대입 가능, const는 재대입 불가
  2. const는 선언과 대입을 동시

const와 let의 공통점

  1. let과 const 둘 다 같은 이름을 갖는 변수의 재선언을 허용하지 않음
  2. 변수가 선언되기 전에 참조하여고 하면 에러
  3. 블록 스코프를 갖음

var와 let,const의 차이

  1. var는 재선언 가능
  2. let, const는 블록 스코프, var는 함수 스코프
const let var
스코프 블록 스코프 블록 스코프 함수 스코프
재대입 X O O
재선언 X X O
호이스팅 X X O
사용 권장 1순위 2순위 3순위

전역변수(글로벌 변수)를 사용하면 안되는 이유

  1. 라이브러리를 사용, 큰 프로젝트 소스를 나누어서 관리할때 충돌이 일어날수 있습니다.
  2. 서버의 중요한 데이터나 공개하고 싶지 않은 데이터를 처리할때(해캥이나 보안적 측면)
    • 브라우저에는 기본적으로 자바스크립트 콘솔이나 디버깅 둘이 내장되어 있으므로 이를 이용하면 소스는 기본이고, 자바스크립트 변수값들도 쉽게 알아낼수 있습니다.
  3. 메모리 관리 측면에서 좋지 않습니다.

    • 예방방법
      1. 클로저 이용
      2. 모듈화
      3. 엄격모드이용 (엄격모드- 엄격하게 문법을 검사하겠다. 전역변수 사용 못하게 함)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
// 글로벌 변수 선언 예시 1
let globalVar = "aaa";

// 글로벌 변수 선언 예시 2
// i와 globalVar3 둘 다 글로벌 변수
// var는 함수 스코프이기 때문
for (var i = 0; i < 10; i++) {
var globalVar3 = "bbb";
}

// 글로벌 변수 선언 예시 3
function testFuc() {
globalVar4 = "ccc";

for (j = 0; j < 10; j++) {
// ...
}
}
testFuc();

console.log(globalVar); // aaa
console.log(i); //10
console.log(globalVar3); //bbb
console.log(globalVar4); //ccc
console.log(j); //10

전역객체 Window

JavaScipt 구동 환경은 모두 전역 객체라는 특별한 객체를 갖고 있습니다. 전역 변수가 선언되면, 이 변수는 또한 전역 객체의 속성이 되어 전역 객체를 통해서 접근할 수 있다.

전역 객체의 이름은 javaScipt 구동 환경마다 다릅니다.

구동환경 전역 객체 이름
웹 브라우저 window
웹 워커 self
Node.js global

scope

변수는 코드의 일정 범위 안에서 유효하다는 성질을 가지고 있는데 이러한 특정 변수가 유효한 코드상의 유효 범위를 가지고 스코프라고 합니다.

  • 현재 접근할 수 있는 변수들의 범위
  • 현재 위치에서 볼 수 있는 변수들의 범위

변수가 스코프 안에 선언되었으면 해당 스코프 안에서 변수에 접근하여 일고 쓸수 있습니다. 하지만 스코프 밖에서는 해당 변수에 접근할 수 없습니다.

1
2
3
4
따로 알아볼것

* scope가 조금 다른 catch
* catch와 with의 예외 - catch와 with의 경우 인자로 포함되는 error/inScope등의 변수들은 scope 안에서만 사용가능하나 그 내부에 선언한 변수들은 global scope를 따른다.

함수scope와 블록scope

함수scope는 함수 단위로 범위를 지정하며 var가 가지고 있는 스코프입니다.
블록scope는 중괄호{} 단위로 범위를 지정하며 let,const가 가지고 있는 스코프입니다.

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
// 함수scope
function scopeTest() {
var is = true;

if (is) {
var is = false;
}

for (var i = 0; i <= 5; i++) {
var inFor = i;
}

console.log(inFor);
console.log(is);
}

scopeTest();
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
// 블록scope
function scopeTest() {
let is = true;

if (is) {
let is = false;
}

for (let i = 0; i <= 5; i++) {
let inFor = i;
}

console.log(is);
console.log(inFor);
}

scopeTest();

스코프 체인

식별자를 찾는 일련의 과정 변수가 스코프 안에 선언되지 않았다면, 그 변수를 찾기 위해 부모 스코프로 올라가고, 거기에도 없다면 또 부모 스코프에 올라가서 찾습니다.

호이스팅

var 변수의 선언부를 제일 위로 끌어올린다. 선언부만! let, const 변수는 호이스팅 기능이 없다.

  • 함수가 함수 선언식으로 선언되면, 현대 스코프의 최상단으로 호이스팅 됩니다.
  • 함수 또는 var로 선언된 변수
  • var는 함수 스코프이기 떄문에 함수 내부에서 맨 상단으로 끌어올려짐.
  • 반면 함수가 함수 표현식으로 선언되면, 함수는 현재 스코프의 최상단으로 호이스팅되지 않습니다.

네스팅된 스코프에서 렉시컬 스코핑

함수가 다른 함수 내부에서 정의되었다면, 내부 함수는 외부 함수의 변수에 접근할 수 있습니다. 이런 행동을 렉시컬 스코핑이라고 합니다.

읽은 자료 (혹은 참고한 링크)

https://gist.github.com/LeoHeo/7c2a2a6dbcf80becaaa1e61e90091e5d

자바스크립트에서 메모리 누수의 4가지 형태

렉시컬 스코프