자바스크립트에서 스코프(Scope)란 무엇인가요?

Q1: 자바스크립트에서 스코프(Scope)란 무엇인가요?
A1: 스코프란 변수, 함수, 객체 등이 접근 가능한 범위를 의미합니다. 즉, 코드에서 식별자(identifier)가 유효하고 참조될 수 있는 영역을 말합니다.

Q2: 자바스크립트에는 어떤 종류의 스코프가 있나요?
A2: 자바스크립트에는 크게 전역 스코프(Global Scope), 함수 스코프(Function Scope), 블록 스코프(Block Scope)가 있습니다.

Q3: 전역 스코프(Global Scope)란 무엇인가요?
A3: 전역 스코프는 코드 어디서나 접근 가능한 스코프입니다. 전역 변수나 전역 함수가 이 영역에 속하며, 브라우저 환경에서는 `window` 객체가 전역 스코프를 관리합니다.

Q4: 함수 스코프(Function Scope)란 무엇인가요?
A4: 함수 내에서 선언된 변수는 해당 함수 내부에서만 접근 가능합니다. 함수가 종료되면 함수 내부 스코프도 사라지므로 변수도 접근할 수 없습니다. 이는 `var` 키워드로 선언된 변수에 적용됩니다.

Q5: 블록 스코프(Block Scope)란 무엇인가요?
A5: 중괄호 `{}`로 묶인 블록 내부에서 변수에 접근 가능한 범위입니다. ES6부터 도입된 `let`과 `const` 키워드로 선언된 변수는 블록 스코프를 가집니다.
Q6: var, let, const는 스코프에 어떤 차이가 있나요?
A6: `var`는 함수 스코프이며 블록 스코프를 무시합니다. `let`과 `const`는 블록 스코프를 가집니다. 따라서 `let`과 `const`는 중괄호 블록 내에서만 접근 가능하지만, `var`는 함수 전체에서 접근 가능합니다.

Q7: 렉시컬 스코프(Lexical Scope)란 무엇인가요?
A7: 자바스크립트는 렉시컬 스코프를 사용합니다. 즉, 함수가 선언된 위치에 따라 스코프가 정해지며, 함수가 호출된 위치와는 관계 없습니다. 함수는 자신이 선언된 환경의 변수들을 참조할 수 있습니다.

Q8: 클로저(Closure)와 스코프는 어떤 관계인가요?
A8: 클로저는 함수와 함수가 선언된 렉시컬 환경(스코프)의 조합입니다. 함수가 외부 함수의 변수에 접근할 수 있도록 하는 메커니즘으로, 스코프 체인을 활용합니다.

Q9: 스코프 체인(Scope Chain)이란 무엇인가요?
A9: 중첩된 함수에서 내부 함수가 변수를 찾을 때, 현재 스코프에서부터 상위 스코프, 전역 스코프로 이어지는 연결 고리를 의미합니다. 이 순서대로 변수의 존재를 확인합니다.

Q10: 스코프 관련해서 흔히 발생하는 오류는 무엇인가요?
A10: 대표적인 오류로는 변수 호이스팅(Hoisting)에 의한 의도하지 않은 값 참조, 변수 중복 선언, 블록 스코프 변수에 대한 접근 오류(예: `let` 변수를 선언 전에 참조), 전역 변수 오염 등이 있습니다. 이를 방지하려면 `let`과 `const`를 적극적으로 사용하고, 변수 선언 위치에 주의해야 합니다.

자바스크립트에서 스코프(Scope)는 변수와 함수의 접근 가능성을 결정하는 영역을 의미합니다.

스코프는 코드의 특정 부분에서 변수가 어떻게 정의되고, 어떻게 접근될 수 있는지를 규정합니다.

스코프는 주로 두 가지 유형으로 나눌 수 있습니다: 전역 스코프(Global Scope)와 지역 스코프(Local Scope). 1. 전역 스코프 (Global Scope) 전역 스코프는 코드의 최상위에서 정의된 변수와 함수가 포함됩니다.

전역 스코프에서 정의된 변수는 프로그램의 어느 곳에서나 접근할 수 있습니다.

예를 들어: ```javascript let globalVar = "I am a global variable"; function showGlobalVar() { console.log(globalVar); } showGlobalVar(); // "I am a global variable" ``` 위의 코드에서 `globalVar`는 전역 변수로, `showGlobalVar` 함수 내에서도 접근할 수 있습니다.



2. 지역 스코프 (Local Scope) 지역 스코프는 함수 내에서 정의된 변수와 함수가 포함됩니다.

이러한 변수는 해당 함수 내에서만 유효하며, 함수 외부에서는 접근할 수 없습니다.

예를 들어: ```javascript function showLocalVar() { let localVar = "I am a local variable"; console.log(localVar); } showLocalVar(); // "I am a local variable" console.log(localVar); // ReferenceError: localVar is not defined ``` 위의 코드에서 `localVar`는 `showLocalVar` 함수 내에서만 유효하며, 함수 외부에서는 접근할 수 없습니다.



3. 블록 스코프 (Block Scope) ES6(ECMAScript 201

5)부터 도입된 `let`과 `const` 키워드를 사용하면 블록 스코프를 생성할 수 있습니다.

블록 스코프는 중괄호 `{}`로 둘러싸인 코드 블록 내에서만 유효한 변수를 정의할 수 있게 해줍니다.

예를 들어: ```javascript if (true) { let blockVar = "I am a block variable"; console.log(blockVar); // "I am a block variable" } console.log(blockVar); // ReferenceError: blockVar is not defined ``` 위의 코드에서 `blockVar`는 `if` 블록 내에서만 유효하며, 블록 외부에서는 접근할 수 없습니다.



4. 스코프 체인 (Scope Chain) 자바스크립트는 스코프 체인(Scope Chain)이라는 개념을 사용하여 변수를 찾습니다.

이는 현재 스코프에서 변수를 찾고, 만약 찾지 못하면 상위 스코프(부모 스코프)로 올라가서 변수를 찾는 방식입니다.

이 과정을 반복하여 최종적으로 전역 스코프까지 올라가게 됩니다.

예를 들어: ```javascript let outerVar = "I am an outer variable"; function outerFunction() { let innerVar = "I am an inner variable"; function innerFunction() { console.log(innerVar); // "I am an inner variable" console.log(outerVar); // "I am an outer variable" } innerFunction(); } outerFunction(); ``` 위의 코드에서 `innerFunction`은 `innerVar`와 `outerVar` 모두에 접근할 수 있습니다.

이는 스코프 체인 덕분입니다.



5. 클로저 (Closure) 스코프의 개념과 밀접하게 관련된 또 다른 중요한 개념은 클로저(Closure)입니다.

클로저는 함수가 자신의 외부 스코프에 있는 변수에 접근할 수 있는 기능을 말합니다.

클로저는 주로 함수가 반환된 후에도 외부 변수를 기억하는 데 사용됩니다.

예를 들어: ```javascript function makeCounter() { let count = 0; return function() { count++; return count; }; } const counter = makeCounter(); console.log(counter()); // 1 console.log(counter()); // 2 console.log(counter()); // 3 ``` 위의 코드에서 `makeCounter` 함수는 `count` 변수를 클로저로 캡슐화하여, 반환된 함수가 호출될 때마다 `count`의 값을 증가시킬 수 있습니다.

결론 자바스크립트의 스코프는 변수와 함수의 접근성을 결정하는 중요한 개념입니다.

전역 스코프, 지역 스코프, 블록 스코프 등 다양한 스코프 유형이 있으며, 스코프 체인과 클로저와 같은 개념을 통해 자바스크립트의 변수 관리와 함수의 동작 방식을 이해할 수 있습니다.

이러한 스코프 개념을 잘 이해하면 자바스크립트 코드를 더 효과적으로 작성하고 디버깅할 수 있습니다.