스코프(1)
25 Jan 2021스코프
란 ‘‘변수에 접근할 수 있는 범위’‘라고 할 수 있습니다.
변수와 상수, 매개변수가 언제 어디서 정의되는지 결정하는 것입니다.
Example
function f(x) {
return x + 3
}
f(5); // 8
x; // x is not defined
x의 스코프는 함수 f입니다.
변수가 스코프
내에 있지 않다고 해서 존재하지 않는 것은 아니니 이 차이에 대해 인지 하고 있어야 합니다.
정적 스코프
자바스크립트는 정적 스코프 언어이다.
정적 스코프는 어떤 변수가 함수 스코프 안에 있는지 함수를 정의할 때 알 수 있다는 뜻입니다.
Example
const x = 5;
function f() {
console.log(x)
console.log(y)
}
{
const y = 10;
f();
}
// 5
// y is not defined
x 변수는 f함수를 정의 할 때 스코프 내에 존재 하였지만 y 변수는 존재하지 않았기 때문에 오류가 발생 하였습니다. f함수를 정의 할때 접근 할 수 있었던 변수에는 호출할 때도 여전히 접근할 수 있지만 호출할 때 스코프에 있는 변수에는 접근할 수 없습니다.
전역 스코프
자바스크립트 프로그램을 시작할 때, 즉 어떤 함수도 호출하지 않았을 때 실행 흐름은 전역스코프에 있습니다. 즉, 전역스코프에서 선언한 것은 무엇이든 프로그램의 모든 스코프에서 볼수 있습니다.
하지만 전역스코프에 의존하는 것은 매우 좋지 않습니다. 전역 스코프에 존재하는 변수는 어디서든 변경될 수 있기 때문에 문제가 발생하더라도 찾기 힘들뿐더러 가 생길 소지가 다분하기 때문입니다.
블록 스코프
let과 const는 식별자를 블록 스코프에서 선언합니다. 블록 스코프는 블록 내에서만 보이는 식별자를 의미합니다.
Example
{
let x = {color : "blue"};
let y = x;
let z = 3;
{
let x= 5;
console.log(x); // 5
console.log(y.color); // blue
y.color = "red";
console.log(z); // 3
}
console.log(x.color); // red 내부 블록에서 변경됨
console.log(y.color); // red
console.log(z); // 3
}
클로저
클로저는 외부함수에 존재하는 변수에 대해 내부함수를 할당하여도 그 변수를 참조할 수 있음을 의미한다.
쉽게 얘기하면 내부 함수를 할당받게 되면 내부 함수의 스코프자체도 함께 할당받게 되어 외부 함수의 변수도 함께 참조 가능한것이다.
Example
function makeFunc(){
var x = 1;
return function(y){
console.log(x+y)
}
}
var myFunc = makeFunc();
myFunc(5); // 6
myFunc에는 makeFunc의 내부함수가 할당 되었다. 일반적이라면 x는 내부함수에 존재하지 않는 변수 이므로 myFunc를 실행했을때 오류가 나야하지만 함수가 선언된 시점에 존재하는 스코프를 함께 가져가기때문에 x도 참조가능하게 된 것이다. 그저 숫자로서의 값이 전달되는 것이 아니라 x라는 변수자체가 전달되는 것이기 때문에 x를 변경하는 것도 가능하다.
출처
https://developer.mozilla.org/ko/docs/Web/JavaScript/Guide/Closures#%ED%81%B4%EB%A1%9C%EC%A0%80closure 러닝 자바스크립트 : 한빛미디어