스코프를 이해하기 위한 컴퓨터 동작 과정 초간단 요약

스코프를 이해하기 위해서 컴퓨터가 동작하는 과정을 조금 알아볼 필요가 있다. 컴퓨터 동작 과정은 복잡하고 이를 정확히 알기 위해서는 컴퓨터 구조에 대해서 더 깊이 이해해야하지만, 우선은 스코프를 이해하는데 도움이 될 정도로만 아주아주 간단히만 요약정리해본다.

컴퓨터는 코드를 읽어서 소프트웨어를 돌릴 때 필요한 자원들을 메모리라는 작업대에 올려두고 일을 한다.

하나의 소프트웨어, 프로세스가 운영체제로부터 할당 받은 메모리 공간이 있다고 치자.

• 코드영역: 전체 프로그램 코드가 저장되는 영역.
• 데이터영역: C나 자바스크립트 등의 전역변수들이 저장되는 영역과 자바나 C# 등의 정적변수들이 저장되는 영역.

이 두 가지 영역은 코드가 프로그램 실행시 사이즈가 확정이 되어서 프로세스가 종료될 때까지 수거되지 않는다.
(이를 실행 컨텍스트가 생성,소멸된다고 표현한다.)

그런데, 모든 종류의 변수들이 이렇게 메모리의 고정된 영역을 차지하고 있으면 메모리 자리가 모자르게 될 것이다.

그래서 특정 함수나 조건/반복문 등에서 쓰이는 변수들은 그 쓰임이 끝나면 시스템적으로나 수동으로, 혹은 가비지 컬렉터 등으로 관리가 된다.

• 스택영역: 함수의 호출과 관계되는 지역 변수와 매개변수가 저장되는 영역.

이렇게 메모리 공간의 스택 영역에 반복문이 도는 동안에 쓰이는 변수가 자리잡는다. 그리고 함수 호출이 완료되면 소멸된다.

그리고 스택은 후입선출, 늦게 들어간 것부터 나오는 구조니까 코드의 순서, 함수 호출의 시점에 따라 변수들이 스택에 들어갔다가 나왔다가 하게 된다. 반복문 안쪽에 선언된 변수는 반복문이 실행될때마다 스택에 쌓였다가, 반복문이 종료되면 pop되는 것!

스택이 쌓이는 구조를 이해하면 스코프를 이해할 수 있다.

스코프 : 변수에 접근할 수 있는 범위 변수가 유효한 범위

• 전역(global) 스코프 : 최상단 전역에 선언되어있어 어느 곳에서든지 해당 변수에 접근할 수 있다는 의미
• 지역(local) 스코프 : 해당 지역에서만 접근할 수 있어 지역을 벗어난 곳에선 접근할 수 없다는 의미 (지역 스코프에 선언된 변수는 전역에서 참조가 불가능하다.)

앞서 정리한 스택이 쌓이는 구조와 함께 스코프의 정의를 생각하면, 왜 함수 안쪽에 선언된 지역변수가 해당 스코프 바깥으로 나가지 못하는지 이해할 수 있다.

스코프 바깥 영역이란 결국 그 변수가 메모리에 올려지기 전, 혹은 내려지고난 후의 시점이라는 뜻이기 때문!

JS에서 함수를 선언하면 함수를 선언할 때마다 새로운 스코프를 생성한다. 그러므로 함수 몸체에 선언한 변수는 해당 함수 몸체 안에서만 접근할 수 있고, 이걸 함수 스코프(function-scoped)라고 한다. 함수 스코프가 바로 지역 스코프의 예다.

스코프 체인이란?

자바스크립트 엔진은 식별자를 찾을 때 일단 자신이 속한 스코프에서 찾고 그 스코프에 식별자가 없으면 상위 스코프에서 다시 찾아 나간다. 이 현상을 스코프 체인 이라고 하며 스코프가 중첩되어있는 모든 상황에서 발생한다.

전역변수 사용을 최소화하는게 좋은 이유

스코프와 스코프 체인을 이해하고나면 전역변수와 지역변수를 필요에 따라 사용할 수 있게 되는데, 이 때 전역변수를 사용하게 되면 의도치 않게 변수 이름이 겹칠 경우 충돌이나 에러가 발생하기 때문에 주의해야 한다. 스코프 체인을 거듭하여 변수에 접근하는 경우에도 코드 가독성이 떨어질 수 있겠다.

🔍

코드블럭 단위로만 암기하듯(?) 당연한듯(?) 알고 있던 스코프와 전역변수, 지역변수에 대해서 메모리, 실행 컨텍스트, 스택 등의 컴퓨터 동작 과정과 함께 생각하니 훨 이해가 잘 된다.

스코프에 대해 정리하면서 언급한 JS 함수 스코프에 대해서는 다음 글에서 var, let, const 키워드와 함께 다뤄보겠다 !