[TIL] 스코프(Scope)😲

스코프(Scope); 변수의 유효범위

Rule

• 바깥 스코프는 안쪽 스코프의 변수를 사용하지 못한다.
• 가장 바깥쪽 스코프; Global scope | 그 외 스코프; Local scope
• 지역 스코프의 우선순위가 더 높다.
  
  

스코프 종류

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

변수와 스코프

• 3가지 변수의 특징

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

** var: 블록 스코프 무시(화살표 함수 제외), 블록 바깥에서도 변수 var의 데이터를 불러올 수 있음(비추천)

• 퀴즈

let name = '김코딩';

function showName() {
  name = '박해커';
  console.log(name); // 박해커;
}

console.log(name); // 김코딩;
showName();
console.log(name); // 박해커;

헷갈린 퀴즈. 함수 showName안에 변수 name의 선언이 없다. 따라서 line3은 변수 name의 재할당으로 볼 수 있다.함수를 실행하기 전 console.log(name);은 전역 스코프에서의 name을 출력하고, 함수 실행 후 console.log(name);은 변수 name에 재할당 된 박해커를 출력한다.
✅ 함수 내에서 선언 키워드 없는 선언은, 함수의 실행 전까지는 선언되지 않은 것으로 취급

** 만약 함수 안에서 let name = '박해커'; 이렇게 선언한다면 마지막 콘솔로그 네임은 전역 스코프에 있는 콘솔로그로, 함수를 포함한 지역 스코프의 변수를 끌어올 수 없으므로, 전역 스코프의 변수 name의 데이터 김코딩을 출력한다.

• window 객체(브라우저 only)

  • 전역 영역을 담고있는 객체. 함수 선언식, var로 전역 변수를 만들면 window 객체에 담김
  • 전역 변수는 가장 바깥 스코프의 변수, 어디서든 접근 가능
  • 선언 없이 변수를 할당하면 var로 지정되어 전역 변수로 취급, 사용🚫
  • js파일 상단에 'use strict'를 입력하면 선언 없이 변수를 할당할 수 없음(에러)