Javascript | 스코프(Scope)

스코프는 참조 대상 식별자(identifier, 변수, 함수의 이름과 같이 어떤 대상을 다른 대상과 구분하여 식별할 수 있는 유일한 이름)를 찾아내기 위한 규칙이다. 자바스크립트는 이 규칙대로 식별자를 찾는다.

기본적으로 프로그래밍은 변수를 선언하고 값을 할당하며 변수를 참조할 수 있는 기능을 제공하게 되고, 이를 토대로 프로그램의 상태를 관리할 수 있다.

전역 혹은 코드 블록(if, while, for, thy/catch 등), 함수 내에 선언하여 변수는 중첩될 수 있고, 자신이 어느곳에서 선언되었는지에 따라 다른 코드가 자신을 참조할 수 있는 범위를 갖게된다.

1. Global (전역) Scope: 코드의 모든 범위에서 사용이 가능.
2. Function (함수) Scope: 함수 안에서만 사용이 가능.
3. Block (블록) Scope: if, for, switch 등 특정 블록 내부에서만 사용이 가능.

const value = 'hello!';

function myFunction() {
  console.log('myFunction: ');
  console.log(value);
}

function otherFunction() {
  console.log('otherFunction: ');
  const value = 'bye!';
  console.log(value);
}

myFunction();
otherFunction();

console.log('global scope: ');
console.log(value);

코드의 맨 윗줄에서 선언된 value 값은 Global Scope 로 선언된 값이다. Global Scope 로 선언된 값은 어디서든지 사용이 가능하다.

otherFunction 에서는 함수 내부에서 value 값을 'bye!' 로 새로 선언을 해주었다. 이렇게 되면, value 라는 값은 Function Scope 로 지정이 되서 해당 값은 otherFunction 내부에서만 유효한 값이 된다. 이렇게 값을 설정한다고 해서 기존에 Global Scope 로 선언된 value 값이 바뀌지 않는다.

함수 레벨 스코프(Function-level scope)

자바 스크립트는 함수 레벨 스코프를 사용한다.
그렇기 때문에, 함수 내에서 선언된 변수는 함수 외부에서는 유효하지 않다.

let a = 10; // 전역변수
function test() { // 지역변수
	let b = 20;
};

console.log(a) //10
console.log(b) // "b"is not define

참고| https://learnjs.vlpt.us/useful/08-scope.html
https://velog.io/@bsjp400/JavaScript-%EC%8A%A4%EC%BD%94%ED%94%84Scope%EB%9E%80