스코프와 this 키워드는 자바스크립트 프로그래밍에서 중요한 개념입니다. 이 두 가지는 변수와 함수의 접근성과 관련이 있으며, 올바르게 이해하고 활용하는 것은 효율적이고 정확한 코드 작성에 도움이 됩니다.

스코프 (Scope)

스코프는 변수, 함수, 객체 등이 접근 가능한 범위를 말합니다. 자바스크립트에서는 전역 스코프와 지역 스코프 두 가지 유형이 있습니다.

전역 스코프 (Global Scope)

전역 스코프는 프로그램의 어디에서든 접근할 수 있는 스코프입니다. 전역 스코프에서 선언된 변수는 프로그램의 어느 곳에서든 사용할 수 있습니다.

const globalVariable = 10;

function globalFunction() {
  console.log(globalVariable);  // 10
}

globalFunction();

지역 스코프 (Local Scope)

지역 스코프는 특정한 코드 블록 내에서만 접근할 수 있는 스코프입니다. 지역 스코프에서 선언된 변수는 해당 블록 내에서만 사용할 수 있습니다.

function localFunction() {
  const localVariable = 20;
  console.log(localVariable);  // 20
}

localFunction();

console.log(localVariable);  // ReferenceError: localVariable is not defined

this 키워드

this 키워드는 현재 실행 중인 함수의 컨텍스트를 참조하는 객체를 가리킵니다. this를 사용하여 객체의 속성에 접근하거나 메소드를 호출할 수 있습니다.

const person = {
  name: "John",
  greet: function() {
    console.log(`Hello, my name is ${this.name}.`);
  }
};

person.greet();  // Hello, my name is John.

this는 호출한 함수 또는 메소드의 주체에 따라 동적으로 결정됩니다. 함수를 일반적인 방법으로 호출하는 경우 this는 전역 객체(Window 객체)를 참조합니다. 그러나 객체의 메소드로 호출되는 경우 this는 해당 객체를 참조합니다.

function globalFunction() {
  console.log(this);  // Window 객체
}

const person = {
  name: "John",
  greet: function() {
    console.log(this);  // person 객체
  }
};

globalFunction();
person.greet();

결론

스코프와 this는 자바스크립트에서 중요한 개념입니다. 스코프를 올바르게 이해하고 변수를 적절하게 선언하여 코드를 모듈화하고, this를 활용하여 객체 지향적인 코드를 작성할 수 있습니다. 이러한 개념을 잘 활용하여 코드를 작성하면 가독성이 좋아지고 유지 보수가 용이해질 것입니다.

#javascript #스코프 #this