본문 바로가기
Computer Science/JavaScript

자바스크립트 Chapter 6 Scope

by Write and Remember 2019. 4. 22.

자바스크립트 핵심 컨셉 33가지

 

챕터 1 ~ 5는 이전 글에서 간단하게 정리하였고

 

2019/03/15 - [Computer Science/Vanilla-JS, ES6] - 자바스크립트 핵심 컨셉 33개

 

자바스크립트 핵심 컨셉 33개

자바스크립트 개발자라면, 알아야 할 핵심 컨셉 33개를 소개한다. https://github.com/leonardomso/33-js-concepts(링크) 깃헙에 컨셉 마다 자세한 설명 그리고 동영상들이 올라와 있다. 매일 한, 두 가지 컨셉에..

jeongw00.tistory.com

 

이어서

 

Chapter 6 Scope

 

변수는 선언된 위치에 따라 유효 범위를 갖게 된다.

 

Function Level Scope



var 키워드로 변수를 선언하면, 그 변수는 함수 레벨 범위를 갖는다.

 

function example(){
  var x = 20;
  console.log(x) // 20
}

example()

console.log(x) // x is not defined

 

위의 함수 내부 변수 x는 함수 레벨 범위를 갖으므로

 

함수 호출이 끝난 후에는 출력이 되지 않는다.

 

if (true){
  var a = 10;
}

console.log(a) // 10

 

if문에서 변수 a는 전역적(Global)으로 선언되었기 때문에

 

a는 10이 출력이 된다.


Block Level Scope


let, const 키워드로 변수를 선언하면, 그 변수는 블록 레벨 범위를 갖는다.

 

여기서 블록이란 {...}을 의미한다.

 

if(true){
  let a = 30;
  console.log(a) // 30
}
console.log(a) // a is not defined

if(true){
  const a = 20;
  console.log(a) // 20
}

console.log(a) // a is not defined

 

const a = 20;

function example() {
  if(true){
    const b = 30;
    console.log(a); // 20
    console.log(b); // 30
  }
}

example()

console.log(a) // 20
console.log(b) // b is not defined

 

inner scope에서는 outer scope를 참조할 수 있지만

 

반대는 불가하다.

 

let으로 선언된 변수는 값 수정 가능하지만 

 

const로 선언된 변수는 값을 수정할 수 없는 상수이다.



그러므로 재할당이 필요한 변수에는 let을 사용

 

재할당이 필요 없는

 

원시 타입과 객체 타입에는 const를 사용

댓글0