스코프(Scope)와 프로미스(Promise)는 JavaScript에서 중요한 개념입니다. 이들은 코드의 구조와 비동기 작업을 처리하는 데 도움을 주며, 코드의 유지 보수성과 효율성을 높일 수 있습니다.

스코프

스코프는 변수와 함수의 유효 범위를 정의합니다. JavaScript는 전역 스코프(Global Scope)와 지역 스코프(Local Scope)를 가지며, 변수와 함수의 선언 위치에 따라 유효 범위가 결정됩니다. 이를 통해 변수나 함수의 중복 선언을 방지하고, 코드의 가독성을 높일 수 있습니다.

전역 스코프는 스크립트 전체에서 액세스할 수 있는 유효 범위를 가지며, 지역 스코프는 함수 내부에서 선언된 변수와 함수에만 적용됩니다. 스코프 체인(Scope Chain)은 스코프 간의 계층적인 관계를 나타내며, 변수가 선언된 스코프에서부터 차례대로 상위 스코프로 검색하여 변수를 찾습니다.

function outer() {
  var x = 10;
  
  function inner() {
    var y = 5;
    console.log(x + y); // outer 스코프의 x와 inner 스코프의 y를 더함
  }
  
  inner();
}

outer(); // 출력: 15

프로미스

프로미스는 비동기 작업을 처리하고, 이를 효율적으로 다루기 위해 사용하는 객체입니다. 이전에는 콜백 함수로 비동기 작업을 처리했지만, 콜백 헬(Callback Hell)과 복잡한 코드 구조로 인해 유지 보수가 어려웠습니다. 프로미스는 이러한 문제를 해결하기 위해 도입되었습니다.

프로미스는 세 가지 상태를 가지며, pending(대기), fulfilled(이행), rejected(거부) 중 하나의 상태를 가집니다. 비동기 작업이 완료되면 fulfilled 상태가 되며, 작업이 실패하면 rejected 상태가 됩니다. 프로미스는 then과 catch 메서드를 사용하여 성공과 실패에 대한 처리를 수행하며, async/await 문법을 통해 비동기 코드를 동기적으로 작성할 수 있습니다.

function fetchData() {
  return new Promise((resolve, reject) => {
    // 비동기 작업 수행
    const data = fetch('https://api.example.com/data');
    
    if (data) {
      resolve(data); // 작업 성공
    } else {
      reject('Error'); // 작업 실패
    }
  });
}

fetchData()
  .then((data) => {
    console.log(data);
  })
  .catch((error) => {
    console.error(error);
  });

결론

스코프와 프로미스는 JavaScript에서 중요한 개념으로, 코드의 구조와 비동기 작업을 다루는 데 도움을 줍니다. 스코프를 통해 변수와 함수의 유효 범위를 제어하고, 프로미스를 이용하여 비동기 작업을 효율적으로 처리할 수 있습니다. 이러한 개념을 잘 숙지하고 활용하여 JavaScript 개발을 진행하면 코드의 유지 보수성과 효율성을 높일 수 있습니다.

#javascript #스코프 #프로미스