스코프(Scope)

블록 스코프(block scope) : 중괄호로 둘러싼 범위

함수 스코프(function scope) : 함수로 둘러싼 범위

함수의 유효범위

함수는 '외부 함수'와 '내부 함수'가 존재한다.

'외부 함수'는 '내부 함수'에 정의되어 있는 변수로 접근 할 수 없다.

다른 함수 내에 정의된 '내부 함수'는 그 함수의 부모 함수에서 정의된 모든 변수 및 부모 함수가 접근할 수 있는 모든 다른 변수까지도 접근할 수 있다.

함수 호이스팅(hoisting)

함수 안에 있는 선언들을 모두 끌어올려 해당 함수 유효 범위의 최상단에 선언하는 것
(실제로 코드들이 끌어올려지는 건 아님)

호이스팅의 대상

var 변수 선언과 함수 선언문에서만 호이스팅이 일어난다.

var변수/함수의 선언만 위로 끌어올려지며, 할당은 끌어 올려지지 않는다.

let/const 변수 선언과 함수표현식에서는 호이스팅이 발생하지 않는다.

변수 선언

var의 문제점

1. 변수 중복 선언이 가능하여, 예기지 못한 값을 반환할 수 있다.
2. 함수 레벨 스코프로 인해 함수 외부에서 선언한 변수는 모두 전역 변수로 된다.
3. 변수 선언문 이전에 변수를 참조하면 언제나 undefined를 반환한다.

let

1. let 키워드로 선언한 변수는 선언 단계와 초기화 단계가 분리되어 진행된다.
   즉, 런타임 이전에 자바스크립트 엔진에 의해 선언 단계가 먼저 실행되지만,
   초기화 단계가 실행되지 않았을 때 해당 변수에 접근하려고 하면 참조 에러가 뜬다.('변수명' is not defined)
   
   
2. let 키워드로 선언한 변수는 스코프의 시작 지점부터 초기화 단계 시작 지점까지 변수를 참조 할 수 없는 일시적 사각지대(Temporal Dead Zone: TDZ) 구간에 존재한다.

const

1. const 키워드는 선언 단계와 초기화 단계가 동시에 진행된다.
   초기화가 진행되지 않은 상태라면 참조 에러가 뜬다.(Cannot access '변수명' before initialization)

spread 문법

주로 배열을 풀어서 인자로 전달하거나, 배열을 풀어서 각각의 요소로 넣을 때에 사용 / 객체로 반환

// Rest 사용 예) 객체의 경우 1
const a = {
 one: '하나',
 two: '둘'
 three: '셋'
}

const { three, ...rest } = a;

console.log(three); // '셋'
console.log(rest); // { one:'하나', two:'둘' }

// rest 안에는 three 값을 제외한 값이 들어있다.

rest 문법

파라미터를 배열의 형태로 받아서 사용할 수 있습니다. 파라미터 개수가 가변적일 때 유용합니다. / 배열로 반환

// Rest 사용 예) 함수 파라미터 1
function sum(...rest) {
  return rest;
}

const result = sum(1,2,3);

console.log(result); // [1, 2, 3]