[자바스크립트] SCOPE 전역, 지역 변수 (block scope 주의점)

SCOPE

변수에 접근성을 결정하는 범위

• Global scope (전역 : 웹 페이지 내의 모든 스크립트에서 접근 가능)
• Local scope (지역 : 특정 함수 또는 블록 범위에서 접근 가능, 외부에서 액세스 불가)
  • Function scope
  • Block scope

ES6(2015) 이전에는 JavaScript에 Global Scope 와 Function Scope 만 있었으나 ES6에서 let 및 const가 도입 되었다.

let과 const는 블록 범위를 제공한다.

그러나 var는 block 범위를 가질 수 없다.

 

let x = 1;
let y = 2;

console.log(x); // 1
console.log(y); // 2

{
	let x = 3;
	let y = 4;

	console.log(x); // 3
	console.log(y); // 4
} //local scope (block scope)

function scope(){
	let x = 5;
	let y = 6;
	console.log(x); // 5
	console.log(y); // 6
} //local scope (function scope)

console.log(x); // 1
console.log(y); // 2
// 전체가 Global scope가 된다.

block scope 주의점 : let 과 var

{ let x = 2; } console.log(x); // x is not defined 블록 외부에서 엑세스 불가

{ var x = 2; } console.log(x); // 2 블록 외부에서 엑세스 가능

var를 지양하는 이유!

var는 함수 스코프이기 때문에 외부에서 접근이 가능할 뿐만 아니라 재선언이 가능하다.

재선언이 가능하다는 것은 스크립트를 길게 작성했을 때 아래에서 똑같은 이름으로 함수를 하나 더 만들어도 그 내용이 덮힌다는 뜻.

한 페이지에 내용이 길면 길수록 이런 부분들은 변수의 재선언으로 인해 오류를 발생하게 된다.

블록 스코프인 let이 변할 수 있는 변수로 작용하기 때문에 굳이 var를 사용할 필요가 없다.

 

-

지양하는 이유에 대해서 더 구체적으로 알고 싶었기 때문에 멘토님의 도움을 받았다. :)