Code States 13일차 - 스코프

스코프와 주요 규칙

범위가 중괄호(블록) 또는 함수에 의해 나뉘어지고, 그 범위를 스코프라고 부른다. 스코프는 "변수 접근 규칙에 따른 유효 범위"이다.

변수 접근 규칙에 따른 유효 범위

• 안쪽 스코프에서 바깥쪽 스코프로는 접근할 수 있지만 반대는 불가능
• 스코프는 중첩이 가능
• 가장 바깥의 스코프는 특별히 전역 스코프(Global Scope)라고 부름
• 전역이 아닌 다른 스코프는 전부 지역 스코프(Local Scope)
• 지역 변수는 전역 변수보다 더 높은 우선순위를 가짐

스코프의 종류

• 블록 스코프(block scope) : 중괄호 기준으로 범위가 구분
• 함수 스코프(function scope) : function 키워드가 등장하는 함수 선언식 및 함수 표현식

유의해야 할 점
화살표 함수는 블록 스코프로 취급된다. 함수 스코프가 아니다.

---

var 키워드와 let 키워드

변수를 정의하는 또 다른 키워드 var

• var 키워드는 블록 스코프를 무시하고, 함수 스코프만 따른다. (이전 방식)
  모든 블록 스코프를 무시하는건 아니다. 화살표 함수의 블록 스코프는 무시하지 않는다.
• 블록 단위로 스코프를 구분했을 때, 훨씬 더 예측 가능한 코드를 작성할 수 있으므로 let 키워드의 사용이 권장한다.
• var를 사용하지 않는다 해도, 함수 스코프는 let으로 선언된 변수의 접근 범위를 제한한다.

const 키워드

값이 변하지 않는 상수를 정의할 때 쓰는 const

• let 키워드와 동일하게, 블록 스코프를 따른다.
• 값의 변경을 최소화하여보다 안전한 프로그램을 만들 수 있다. 값을 새롭게 할당할 일이 없다면, const 키워드의 사용이 권장된다.
• 값을 재할당하는 경우, TypeErrorr가 발생한다.

let, var, const 키워드 비교

	let	const	var
유효 범위	블록 스코프 및 함수 스코프	블록 스코프 및 함수 스코프	함수 스코프
값 재할당	가능	불가능	가능
재선언	불가능	불가능	가능

---

변수 선언에서 주의할 점

window 객체 (브라우저 only)

var로 선언된 전역 변수 및 전역 함수는 window 객체에 속하게 된다.

• 브라우저에는 window라는 객체가 존재한다.
  • 브라우저를 대표하는 객체
  • 그러나, 브라우저 창과 관계없이 전역 항목도 담고있다.
• var로 선언된 전역 변수와 전역 함수가 window 객체에 속한다.

전역 변수는 최소화

전역 변수에 너무 많은 변수를 선언하지 마라

• 전역 변수 : 어디서든 접근 가능한 변수
• 편리한 대신, 다른 함수 혹은 로직에 의해 의도되지 않은 변경이 발생할 수 있음
  • 부수 효과(side effect) 발생

let, const 를 주로 사용

var는 블록 스코프를 무시하며, 재선언을 해도 에러를 내지 않는다.

• 같은 스코프에서 동일한 이름의 변수를 재선언 하는 것은 버그를 유발한다.

전역 변수를 var로 선언하는 경우 문제가 될 수도 있다.

• var로 선언한 전역 변수가 window 기능을 덮어씌워서 내장 기능을 사용할 수 없게 만들 수 있다.

선언 없는 변수 사용 금지

선언 키워드(var, let, const)없이 변수를 할당하면 안된다.

실수를 방지하기 위해 Strict Mode를 사용할 수 있다.

Strict Mode는 브라우저가 보다 엄격하게 작동하도록 만들어준다. 앞서 언급한 것처럼 "선언 없는 변수 할당"의 경우도 Strict Mode는 에러로 판단한다. Strict Mode를 적용하려면, js 파일 상단에 'use strict' 라고 입력하면 된다. (따옴표 포함)