LifeCycle
- 시스템의 모든 자원은 라이프 사이클 즉, 생애 주기를 갖는다
- 생애주기(생애주기 메커니즘) ? 생성 → 사용 → 소멸 되는 메커니즘을 의미
- 컴퓨터 시스템의 자원은 유한하고, 한정된 자원을 효과적으로 사용하기 위한 방식
=> Javascript의 자원들 (값, 변수, 함수 등) 또한 생애주기를 갖는다
Javascript LifeCycle
- Javascript에서 자원 = 값을 의미
- Javascript의 값은 모두 생애주기 메커니즘의 영향을 받음
- 모든 값은 저장되며, 저장되기 위한 저장소가 필요
=> 값이 저장되는 저장소를 scope( 영역, 지역 ) 라 부름
<script>
// 전역(Global) 스코프
function func1() {
// 함수(Function) 스코프
}
</script>Scope
- LifeCycle 을 가진 자원( 값, 변수, 함수 등 )이 저장되는 스코프( 영역, 지역 )
JavaScript Scope
1. 전역 스코프 Global
- 프로그램의 생애 주기와 동일한 스코프
- 브라우저가 HTML을 로딩한 후 페이지를 벗어나 새로고침 할 때까지의 주기를 가진다
- 모든 스코프의 최상위 스코프이며 모든 지역 범위에서 참조 가능
2. 지역(함수) 스코프 Function
- 전역 스코프 이외에 생성된 스코프
- 함수 스코프 Function
- 함수가 호출되는 즉시 함수 스코프가 생성
- 함수 안에서 생성된 모든 변수들은(인수 포함) 함수가 실행되는 순간에 생성
- 함수가 종료되는 순간 함수와 함께 모두 제거
3. 블록 스코프 Block
- ES2015(ES6) 추가
ES5(2009년), ES6(2015년) 발표.- 블록 스코프는 블록 안에서 생성
- 블록 스코프는 ES2015 버전에서 지원되기 시작
- if, while, for 등의 코드 블록으로 스코프 생성
- 블록 내에서 변수를 만들 때 var로 만든다면 상위의 함수 스코프에 변수가 만들어짐
- 그러므로 새롭게 지원되는 블록 스코프에 변수를 만들기 위해서는 let이나 const가 필요
Scope 사용 예시
<script>
let scope= '전역 스코프';
function scopeTest() {
let scope= '함수 스코프';
if (scope) {
let scope= '블록 스코프';
console.log(scope); // '블록 스코프'
}
console.log(scope); // '함수 스코프'
}
scopeTest();
console.log(scope); // '전역 스코프'
</script>
Study !