📘 6.1.2 변수 찾기 규칙 - 변수를 찾아가는 조용한 방법
지난 시간에 우리는 스코프 체인이라는 흥미로운 개념을 배웠습니다. 마치 학교에서 물건을 찾거나 아파트에서 필요한 것을 찾는 것처럼, 자바스크립트가 변수를 찾아가는 순서가 있다는 것을 알게 되었죠.
오늘은 이런 스코프 체인을 바탕으로 변수 찾기 규칙에 대해 더 자세히 알아보겠습니다. 마치 조용한 숨바꼭질 게임을 하는 것처럼, 변수들이 어디에 숨어있는지 찾아가는 과정을 함께 따라가 보겠습니다.
🧠 새로운 단어들과 친해지기
변수 찾기 규칙을 이해하는 데 도움이 되는 단어들을 알아보겠습니다.
| 단어 | 의미 |
|---|---|
| 변수 찾기 | 변수 이름을 보고 실제 값이 어디에 있는지 찾아가는 과정입니다. 마치 숨바꼭질 게임과 같습니다. |
| 찾기 순서 | 변수를 찾을 때 거쳐가는 장소들의 순서를 의미합니다. 마치 집 → 동네 → 도시 순서처럼요. |
| 변수 가리기 | 같은 이름의 변수가 여러 곳에 있을 때 가까운 것이 먼 것을 보이지 않게 하는 현상입니다. |
| 우선순위 | 같은 이름의 변수들 중에서 어떤 것을 먼저 선택할지 정하는 규칙입니다. 가까운 것이 항상 우선됩니다. |
| 변수 없음 오류 | 찾고 있는 변수가 어디에도 없을 때 발생하는 오류입니다. 컴퓨터가 "그런 변수는 없어요"라고 알려주는 것입니다. |
'변수 찾기'는 "찾아보다"라는 뜻입니다. 마치 사전에서 단어를 찾아보는 것처럼, 자바스크립트도 변수를 찾기 위해 여러 곳을 차례대로 찾아본다는 의미입니다.
✨ 변수 찾기 규칙, 그것은 무엇일까요?
변수 찾기 규칙은 자바스크립트가 변수를 찾을 때 사용하는 간단하고도 예측 가능한 방법입니다. 이 규칙은 마치 조용한 숨바꼭질 게임과 같습니다.
숨바꼭질을 할 때 가까운 곳부터 시작해서 점점 멀리 찾아가는 것처럼, 자바스크립트도 정해진 순서에 따라 변수를 찾아갑니다.
가장 중요한 원칙은 "가까운 곳부터 먼 곳 순서"로 찾아간다는 것입니다. 마치 잃어버린 물건을 찾을 때 가까운 곳부터 찾아보는 것과 같습니다.
또한 같은 이름의 변수가 여러 곳에 있을 때는 가장 가까운 것만 선택한다는 규칙이 있습니다. 이를 변수 가리기라고 하는데, 마치 가까운 나무가 멀리 있는 나무를 가려서 보이지 않게 하는 것과 같은 현상입니다.
마음속 이야기: 집에서 물건 찾기
변수 찾기 규칙을 더 쉽게 이해하기 위해 '집에서 물건을 찾는 이야기'를 들어보겠습니다.
여러분이 집에 있는데 급하게 "연필"을 찾아야 한다고 생각해보세요. 집에는 연필이 여러 곳에 있을 수 있잖아요. 어떻게 찾아야 할까요?
먼저 내 방을 찾아봅니다. "내 책상 위에 있나?" 만약 여기서 연필을 찾았다면, 더 이상 찾을 필요가 없습니다. 바로 그것을 사용하면 됩니다.
하지만 내 방에 연필이 없다면, 다음으로 거실을 찾아봅니다. "거실 테이블 위에 있을까?" 여기서 연필을 찾았다면, 이것을 사용합니다.
그래도 없다면 다른 방들을 찾아봅니다. "형 방이나 부모님 방에 있을까?" 여기서 찾았다면 빌려서 사용할 수 있습니다.
만약 집 어디에도 연필이 없다면? "연필이 없어요!"라고 포기하게 되겠죠.
그런데 만약 모든 방에 연필이 있다면 어떻게 될까요? 우리는 가장 가까운 연필만 사용하게 될 것입니다. 내 방에 연필이 있으면 다른 방의 연필들은 전혀 신경 쓰지 않는 것처럼 말입니다.
이것이 바로 자바스크립트의 변수 찾기 규칙과 같습니다.
🎯 왜 변수 찾기 규칙을 배워야 할까요?
그렇다면 우리는 왜 변수 찾기 규칙을 배워야 할까요?
첫째, 코드가 어떻게 동작할지 미리 예상할 수 있습니다. 어떤 변수가 어디서 오는지 미리 알 수 있다면, 코드가 어떻게 실행될지 예상할 수 있습니다.
둘째, 변수 이름이 겹치는 문제를 피할 수 있습니다. 같은 이름의 변수를 실수로 여러 곳에 만들었을 때 어떤 일이 일어날지 미리 알 수 있어서, 이런 실수를 방지할 수 있습니다.
셋째, 코드를 읽고 이해하기가 쉬워집니다. 다른 사람이 만든 코드를 볼 때도 "아, 이 변수는 여기서 온 것이구나!"라고 빠르게 알 수 있습니다.
넷째, 오류를 쉽게 찾고 고칠 수 있습니다. 변수를 찾지 못해서 오류가 발생했을 때, 어디서 문제가 생겼는지 빠르게 찾아낼 수 있습니다.
⚙️ 기본 사용법 배우기
변수 찾기 규칙은 특별한 문법이 따로 있는 것은 아닙니다. 대신 우리가 이미 알고 있는 변수와 함수들이 어떤 순서로 찾아지는지를 이해하는 것이 중요합니다.
🔹 기본 변수 찾기 순서
// 1단계: 전체 공간 (가장 넓은 범위)
let 전체메시지 = "전체 공간에서 온 메시지";
function 바깥함수() {
// 2단계: 바깥쪽 함수 공간 (중간 범위)
let 바깥메시지 = "바깥쪽 함수에서 온 메시지";
function 안쪽함수() {
// 3단계: 안쪽 함수 공간 (가장 좁은 범위)
let 안쪽메시지 = "안쪽 함수에서 온 메시지";
// 변수 찾기 순서:
// 안쪽메시지: 3단계에서 바로 찾기 ✅
// 바깥메시지: 3단계 → 2단계에서 찾기 ✅
// 전체메시지: 3단계 → 2단계 → 1단계에서 찾기 ✅
}
}
🔹 변수 찾기 결과
변수 찾기는 여러 가지 상황에 따라 다른 결과를 보여줍니다.
- 현재 공간에 있다면: 즉시 찾아서 성공
- 위쪽 공간에 있다면: 차례대로 올라가면서 찾아서 성공
- 여러 공간에 같은 이름이 있다면: 가장 가까운 것을 사용하여 성공
- 어디에도 없다면: 오류가 발생
🎯 5단원 복습 문제 - 함수 연습하기
6단원을 배우기 전에 5단원에서 배운 함수를 복습해보겠습니다.
과거의 기억을 더듬어 우리가 배운 함수들을 다시 한 번 들여다보는 것은, 마치 오래된 편지를 다시 읽는 것과 같습니다. 그 안에는 우리가 함께 걸어온 배움의 흔적이 고스란히 남아 있습니다.
복습 문제 1: 함수 범위와 변수 연습하기
// 전체 변수와 함수 변수의 차이 이해하기
let 전체숫자 = 0; // 전체 변수: 어디서든 접근 가능
function 테스트함수() {
let 함수숫자 = 5; // 함수 변수: 함수 안에서만 접근 가능
전체숫자 = 전체숫자 + 1; // 전체 변수 수정하기
console.log("함수 안에서 함수 변수:", 함수숫자);
console.log("함수 안에서 전체 변수:", 전체숫자);
}
function 다른함수() {
console.log("다른 함수에서 전체 변수:", 전체숫자);
}
// 함수들 실행해보기
console.log("=== 함수 범위 복습하기 ===");
console.log("처음 전체 변수:", 전체숫자); // 0
테스트함수(); // 함수 실행하기
console.log("함수 실행 후 전체 변수:", 전체숫자); // 1
다른함수(); // 다른 함수에서 전체 변수 확인하기
해답과 설명: 전체 변수는 모든 함수에서 사용할 수 있지만, 함수 변수는 그 함수 안에서만 사용할 수 있습니다. 각 함수는 자신만의 독립된 공간을 가지고 있습니다.
복습 문제 2: 함수 안의 함수에서 변수 접근 연습하기
// 함수 안의 함수에서 바깥쪽 변수에 접근하기
function 바깥함수() {
let 바깥변수 = "바깥쪽 변수"; // 바깥쪽 함수의 변수
let 공유데이터 = "공유 데이터"; // 안쪽 함수에서도 사용할 변수
console.log("바깥쪽 함수:", 바깥변수);
function 안쪽함수() {
let 안쪽변수 = "안쪽 변수"; // 안쪽 함수만의 변수
// 안쪽 함수는 바깥쪽 변수에 접근 가능
console.log("안쪽 함수에서 바깥쪽 변수:", 바깥변수);
console.log("안쪽 함수에서 공유 데이터:", 공유데이터);
console.log("안쪽 함수의 자체 변수:", 안쪽변수);
}
안쪽함수(); // 안쪽 함수 실행하기
}
// 함수 테스트하기
console.log("=== 함수 안의 함수 복습하기 ===");
바깥함수();
해답과 설명: 함수 안의 함수에서는 안쪽 함수가 바깥쪽 함수의 변수에 접근할 수 있습니다. 하지만 바깥쪽 함수는 안쪽 함수의 변수에 접근할 수 없습니다.
🧪 직접 해보면서 배우기
이제 실제 예제들을 통해 변수 찾기 규칙이 어떻게 동작하는지 차근차근 살펴보겠습니다.
🔹 예제 1: 기본적인 숨바꼭질 게임
첫 번째 예제에서는 변수 찾기의 기본 순서를 숨바꼭질 게임으로 이해해보겠습니다.
// Ex1) 보물찾기 게임처럼 변수를 찾아보자!
// 전체 지역의 보물들 (전체 변수)
let 다이아몬드 = "전체 다이아몬드"; // 전체에서 관리하는 보물 저장하기
// 숲 지역 (바깥쪽 함수)
function 숲() {
let 은화 = "숲의 은화"; // 숲에서만 얻을 수 있는 보물 저장하기
console.log("숲에서 찾은 것들:");
console.log("- 은화:", 은화); // 현재 숲에서 바로 찾기
console.log("- 다이아몬드:", 다이아몬드); // 전체 지역에서 찾아오기
// 동굴 탐험 (안쪽 함수)
function 동굴() {
let 루비 = "동굴의 루비"; // 동굴에서만 얻을 수 있는 보물 저장하기
console.log("\n동굴에서 찾은 것들:");
console.log("- 루비:", 루비); // 현재 동굴에서 바로 찾기
console.log("- 은화:", 은화); // 숲 지역에서 찾아오기
console.log("- 다이아몬드:", 다이아몬드); // 전체 지역에서 찾아오기
}
동굴(); // 동굴 탐험 시작!
}
// 보물찾기 게임 시작!
console.log("💎 보물찾기 게임을 시작합니다!");
숲();
console.log("\n전체 확인:", "다이아몬드는", 다이아몬드);
이 예제는 보물찾기와 같습니다. 동굴에서 보물을 찾을 때, 먼저 동굴 안에서 찾아보고, 없으면 숲에서 찾아보고, 그래도 없으면 전체 지역에서 찾아보는 과정을 보여줍니다.
🔹 예제 2: 같은 이름의 물건이 여러 곳에 있을 때
두 번째 예제에서는 같은 이름의 변수가 여러 곳에 있을 때 어떤 것이 선택되는지 알아보겠습니다.
// Ex2) 집, 방, 책상에 모두 "연필"이 있을 때 어떤 것을 사용할까?
// 집에 있는 연필
let 연필 = "집 연필"; // 집 전체의 연필 저장하기
// 내 방 (바깥쪽 함수)
function 내방() {
let 연필 = "방 연필"; // 방 연필이 집 연필을 가림
console.log("방에서 사용하는 연필:", 연필); // "방 연필" 출력하기
// 내 책상 (안쪽 함수)
function 내책상() {
let 연필 = "책상 연필"; // 책상 연필이 방 연필과 집 연필을 모두 가림
console.log("책상에서 사용하는 연필:", 연필); // "책상 연필" 출력하기
}
내책상(); // 책상으로 가서 연필 사용하기
console.log("다시 방에서 사용하는 연필:", 연필); // 책상에서 나온 후 다시 "방 연필" 출력하기
}
// 연필 찾기 게임 시작!
console.log("✏️ 같은 이름 연필 구별하기!");
내방(); // 내 방으로 들어가기
console.log("집에서 사용하는 연필:", 연필); // 방에서 나온 후 다시 "집 연필" 출력하기
이 예제는 같은 이름의 물건이 여러 곳에 있을 때 어떤 것을 사용하게 되는지 보여줍니다. 가장 가까운 곳의 물건만 보이고, 멀리 있는 같은 이름의 물건들은 가려져서 보이지 않습니다.
🔹 예제 3: 블록에서 물건 찾기
세 번째 예제에서는 let과 const의 블록에서 변수 찾기가 어떻게 동작하는지 알아보겠습니다.
// Ex3) 교실, 수학시간, 모둠활동에서 각각 다른 물건들을 사용해보자!
// 교실 전체의 공용 물건들
let 공용연필 = "교실 공용 연필"; // 교실에서 모두가 사용하는 연필 저장하기
let 공용지우개 = "교실 공용 지우개"; // 교실에서 모두가 사용하는 지우개 저장하기
// 수학 시간 (함수)
function 수학시간() {
let 수학책 = "수학 교과서"; // 수학 시간에만 사용하는 교과서 저장하기
console.log("수학 시간에 사용하는 것들:");
console.log("- 수학책:", 수학책); // 현재 함수에서 찾기
console.log("- 연필:", 공용연필); // 교실에서 찾아오기
// 모둠 활동 시간 (블록)
if (true) {
let 활동지 = "모둠 활동지"; // 모둠 활동에만 사용하는 활동지 저장하기
let 공용연필 = "모둠 연필"; // 교실 연필을 가리는 모둠 전용 연필 저장하기
console.log("\n모둠 활동 중:");
console.log("- 활동지:", 활동지); // 블록에서 바로 찾기
console.log("- 연필:", 공용연필); // 블록에서 찾기 (모둠 연필)
console.log("- 지우개:", 공용지우개); // 교실에서 찾아오기
console.log("- 수학책:", 수학책); // 함수에서 찾아오기
}
console.log("\n모둠 활동 끝난 후:");
console.log("- 연필:", 공용연필); // 다시 교실 연필 사용하기
console.log("- 수학책:", 수학책); // 여전히 함수에서 찾기
}
// 수학 시간 시작!
console.log("📚 수학 시간 물건 찾기!");
수학시간(); // 수학 시간 시작하기
console.log("\n수업 끝난 후 교실에서:", 공용연필); // 수업 끝난 후 "교실 공용 연필" 확인하기
이 예제는 교실 → 수학시간 → 모둠활동으로 이어지는 범위에서 물건을 찾는 과정을 보여줍니다. 특히 블록({}) 안에서 만든 변수는 블록이 끝나면 사라진다는 점을 확인할 수 있습니다.
🧚♀️ 이야기로 다시 배우기: 우리 학교 이야기
지금까지 배운 내용을 하나의 조용한 이야기로 다시 정리해보겠습니다.
우리 동네에는 정말 체계적으로 운영되는 학교가 하나 있었습니다. 이 학교는 특별한 구조로 되어 있었습니다.
1층 로비에는 모든 학생이 사용할 수 있는 공용 물건들이 있었습니다. 복사기, 안내데스크, 공용 연필 등이 있어서 누구나 언제든지 사용할 수 있었습니다.
2층 교실에는 우리 반만의 물건들이 있었습니다. 우리 반 학생들은 1층 공용 물건과 2층 교실 물건을 모두 사용할 수 있었지만, 다른 반 학생들은 우리 반에 들어올 수 없었습니다.
내 책상에는 나만 사용할 수 있는 개인 물건들이 있었습니다. 나는 모든 곳의 물건을 다 사용할 수 있었지만, 다른 사람들은 내 책상 서랍을 열 수 없었습니다.
이 학교의 조용한 약속이 있었는데, 바로 가까운 곳의 물건을 먼저 사용한다는 것이었습니다. 만약 내가 "연필"을 찾는다면, 내 책상에 있으면 내 연필을, 내 책상에 없으면 교실 연필을, 교실에도 없으면 1층 로비 연필을 사용하게 되는 것입니다.
이 학교 시스템이 바로 우리가 배운 변수 찾기 규칙과 같습니다.
🧠 자주 하는 실수와 주의할 점
변수 찾기 규칙을 배우면서 많은 분들이 실수하는 부분들을 미리 알아두면 더 안전한 코딩을 할 수 있습니다.
❌ 실수 1: 변수가 어디서 오는지 헷갈리기
let 학생이름 = "전체 학생";
function 교실() {
let 학생이름 = "교실 학생"; // 전체 학생이름을 가림
function 책상() {
console.log("책상에서 부르는 학생:", 학생이름); // 어떤 학생일까요?
}
책상();
}
교실();
이런 실수가 생기는 이유는 가장 가까운 변수를 선택한다는 규칙을 잊어버리기 때문입니다. 위 코드에서는 "교실 학생"이 출력됩니다.
❌ 실수 2: 블록 범위를 잊어버리기
function 테스트함수() {
if (true) {
let 블록변수 = "블록 안의 변수";
console.log("블록 안에서:", 블록변수); // 정상 작동
}
// console.log("블록 밖에서:", 블록변수); // 오류! 접근할 수 없어요
}
// 올바른 방법
function 올바른함수() {
let 내변수; // 함수 맨 위에 미리 만들기
if (true) {
내변수 = "값을 넣기"; // 블록 안에서 값만 넣기
}
console.log("블록 밖에서:", 내변수); // "값을 넣기" 정상 출력
}
테스트함수();
올바른함수();
let과 const로 만든 변수는 블록({}) 안에서만 살아있다는 것을 기억해야 합니다.
❌ 실수 3: 변수 가리기로 인한 혼동
let 숫자 = 10; // 전체 공간 숫자
function 나쁜예시() {
let 숫자 = 5; // 전체 공간 숫자를 가림
function 안쪽함수() {
console.log("숫자:", 숫자); // 5가 출력됨 (전체 공간 10이 아님!)
}
안쪽함수();
}
// 좋은 방법: 다른 이름 사용하기
function 좋은예시() {
let 지역숫자 = 5; // 다른 이름으로 혼동 방지
function 안쪽함수() {
console.log("전체 숫자:", 숫자); // 10 (전체 공간)
console.log("지역 숫자:", 지역숫자); // 5 (지역)
}
안쪽함수();
}
나쁜예시();
좋은예시();
같은 이름의 변수를 여러 곳에 만들면 혼동이 생기기 쉽습니다. 가능하면 서로 다른 이름을 사용하는 것이 안전합니다.
✏️ 연습문제로 개념 다지기
이제 배운 내용을 연습문제를 통해 차근차근 익혀보겠습니다.
Ex1) 동물 이름으로 변수 찾기 과정을 연습해보세요
let 동물 = "전체 고양이"; // 전체 공간에서 사용하는 동물 저장하기
function 집() {
let 동물 = "집 강아지"; // 집에서 키우는 동물 저장하기 (전체 동물을 가림)
function 방() {
console.log("방에서 만난 동물:", 동물); // 현재 공간에서 동물 찾기 → 상위 공간 집에서 "집 강아지" 찾기
}
방(); // 방으로 들어가서 동물 확인하기
}
집(); // 집으로 들어가기
정답: "집 강아지"가 출력됩니다.
Ex2) 색깔 이름으로 변수 가리기 현상을 확인해보세요
let 색깔 = "빨강"; // 전체 공간의 색깔 저장하기
function 색깔바꾸기() {
let 색깔 = "파랑"; // 함수 안의 색깔 저장하기 (전체 색깔을 가림)
console.log("함수 안 색깔:", 색깔); // 현재 함수에서 색깔 찾기 → "파랑" 출력하기
}
색깔바꾸기(); // 색깔 바꾸는 함수 실행하기
console.log("전체 색깔:", 색깔); // 전체 공간에서 색깔 찾기 → "빨강" 출력하기
정답: 함수 안 색깔: "파랑", 전체 색깔: "빨강"
Ex3) 블록 범위에서 변수 접근 연습해보세요
function 블록테스트() {
let 바깥변수 = "바깥쪽 변수"; // 함수 전체에서 사용할 수 있는 변수 저장하기
if (true) {
let 안쪽변수 = "안쪽 변수"; // 블록 안에서만 사용할 수 있는 변수 저장하기
console.log("블록 안에서 바깥쪽 변수:", 바깥변수); // 블록에서 상위 공간의 변수 찾기
}
console.log("블록 밖에서 바깥쪽 변수:", 바깥변수); // 함수에서 자신의 변수 찾기
}
블록테스트(); // 블록 테스트 함수 실행하기
정답:
- 첫 번째:
"바깥쪽 변수"(블록 안에서 상위 공간에 접근 가능) - 두 번째:
"바깥쪽 변수"(현재 공간)
🤔 심화 문제로 실력 확인하기
기본 연습을 마쳤다면, 이제 조금 더 깊이 있는 문제들을 통해 변수 찾기 규칙에 대한 이해를 확인해보겠습니다.
Q1. 복잡한 구조에서 변수 찾기 과정을 분석해보세요.
let 전체메시지 = "전체 공간 메시지";
function 단계1() {
let 단계1메시지 = "1단계 메시지";
function 단계2() {
let 단계2메시지 = "2단계 메시지";
function 단계3() {
console.log("3단계에서 전체:", 전체메시지); // 어떤 과정?
console.log("3단계에서 1단계:", 단계1메시지); // 어떤 과정?
console.log("3단계에서 2단계:", 단계2메시지); // 어떤 과정?
}
단계3();
}
단계2();
}
단계1();
정답:
- 전체메시지: 단계3 → 단계2 → 단계1 → 전체 공간에서 찾음
- 단계1메시지: 단계3 → 단계2 → 단계1에서 찾음
- 단계2메시지: 단계3 → 단계2에서 찾음
Q2. 변수 찾기 규칙을 활용한 간단한 카운터를 만들어보세요.
function 카운터만들기() {
let 숫자 = 0; // 외부에서 직접 접근할 수 없는 변수
function 증가() {
숫자 = 숫자 + 1; // 상위 공간의 숫자에 접근해서 1 증가시키기
console.log("숫자 증가:", 숫자);
}
function 감소() {
숫자 = 숫자 - 1; // 상위 공간의 숫자에 접근해서 1 감소시키기
console.log("숫자 감소:", 숫자);
}
function 값확인() {
console.log("현재 값:", 숫자); // 상위 공간의 숫자 값 확인하기
}
// 카운터 테스트
값확인(); // 0 출력하기
증가(); // 1 출력하기
증가(); // 2 출력하기
감소(); // 1 출력하기
값확인(); // 1 출력하기
}
카운터만들기(); // 카운터 시스템 실행하기
해설: 변수 찾기 규칙을 이용하면 정보를 보호하면서도 필요한 기능은 제공하는 시스템을 만들 수 있습니다.
💫 마무리하며
지금까지 변수 찾기 규칙이라는 흥미진진한 개념에 대해 자세히 알아보았습니다. 마치 조용한 숨바꼭질 게임이나 학교에서 물건을 찾는 것처럼, 자바스크립트도 체계적이고 예측 가능한 방법으로 변수를 찾아간다는 것을 배웠습니다.
가장 중요한 것은 가까운 곳부터 먼 곳 순서로 찾아간다는 원칙과, 같은 이름의 변수가 있을 때는 가장 가까운 것을 선택한다는 규칙입니다. 이제 여러분도 변수 찾기 규칙을 이해해서 더욱 안전하고 예측 가능한 코드를 작성할 수 있을 것입니다.
다음 시간에는 더 흥미진진한 자바스크립트 개념들을 함께 탐험해보겠습니다. 여러분의 코딩 실력이 하루하루 성장하는 모습을 보니 정말 뿌듯합니다. 계속 함께 걸어가겠습니다. ✨
✅ 학습 완료 체크리스트
이번 시간에 배운 내용들을 모두 이해했는지 확인해보세요.
| 학습 내용 | 이해했나요? |
|---|---|
| 변수 찾기 규칙의 기본 개념 | ✅ |
| 기본 사용법과 문법 | ✅ |
| 주요 특징과 차이점 | ✅ |
| 자주 하는 실수들 | ✅ |
| 실전 예제 이해 | ✅ |
| 5단원 함수 복습 | ✅ |
🎯 추가 연습 문제들
조금 더 연습하고 싶은 분들을 위한 추가 문제들입니다.
추가 문제 1. 다음 코드의 출력 결과를 예측해보세요.
let 메시지 = "전체 메시지";
function 바깥() {
let 메시지 = "바깥 메시지";
function 안쪽() {
console.log(메시지);
}
안쪽();
}
바깥();
답: "바깥 메시지" (안쪽 함수에서 상위 범위인 바깥 함수의 메시지 찾음)
추가 문제 2. 변수 가리기 현상을 이용한 예제를 만들어보세요.
let 색깔 = "빨강";
function 색깔바꾸기() {
let 색깔 = "파랑";
console.log("함수 색깔:", 색깔); // 어떤 값?
}
색깔바꾸기();
console.log("전체 색깔:", 색깔); // 어떤 값?
답: 함수 색깔: "파랑", 전체 색깔: "빨강"
추가 문제 3. 블록 범위에서 변수 접근을 테스트해보세요.
function 블록테스트() {
let 바깥변수 = "바깥 변수";
if(true) {
let 안쪽변수 = "안쪽 변수";
console.log(바깥변수); // 결과는?
}
console.log(바깥변수); // 결과는?
}
블록테스트();
답:
- 첫 번째:
"바깥 변수"(상위 범위에서 찾음) - 두 번째:
"바깥 변수"(현재 범위)
📂 마무리 정보
오늘 배운 6.1.2 내용이 여러분의 자바스크립트 지식 보관함에 잘 저장되었나요? 다음 시간에는 더 흥미진진한 내용으로 만나겠습니다.
기억할 점: 오늘 배운 내용을 꼭 연습해보시고, 궁금한 점이 있으면 언제든 다시 돌아와서 읽어보세요.
무료 JavaScript 학습 플랫폼에서 단계별 학습과 실시간 코드 실행을 통해
더욱 효과적이고 재미있게 학습하실 수 있습니다.
'6. 함수의 비밀 (클로저) > 6.1 렉시컬 스코프 이해하기' 카테고리의 다른 글
| 6.1.1 스코프 체인 - 변수를 찾아가는 조용한 여행 (0) | 2025.07.05 |
|---|