200806 [scope & closure]

[scope]

 : scope는 javascript 변수의 접근가능 범위를 말하는 것입니다. scope는 크게 두 가지 종류가 있는데 global scope(전역 스코프) 와 local scope(지역 스코프) 입니다.

[global scope( 전역 범위 )]

 : 변수가 함수 바깥으로 선언 되거나 { } 바깥에 선언 되면 global scope 에 해당 합니다.

global scope에 선언된 변수는 언제든 참조가 가능하고 값을 재설정 할 수 있습니다. 심지어 함수 안에서도 사용이 가능합니다.( 전역 변수 )

하지만, global scope 에는 변수를 선언 않는것이 좋습니다. 두 개 이상의 변수선언으로 충돌이 나거나(const / let 으로 선언 시) 값의 재설정(var 로 설정 시)으로 오류가 날수 있기 때문입니다.

[local scope ( 지역 범위 )]

 : local scope 는 선언된 특정 범위 내에서 생성된 변수만 사용 가능한 영역입니다.

(지역변수)

이런 local scope에는 function scope 와 block scope 로 나눠 집니다.

▶function scope (함수 영역)

 :  함수 안에 변수를 선언 한다면 그 함수는 함수 내에서만 사용이 가능하고 외부에서 접근 할 수 없습니다. 마찬가지로 함수가 종료되면 선언된 변수는 없어지고 참조 할 수 없습니다. 이 함수선언에는 선언식과 표현식이 있는데 함수를 선언식으로 사용하면 호이스팅이 가장 상단으로 올라오기 때문에 선언식으로 사용하는 것이 좋다고 합니다.

선언식

function Hello () {

   console.log('Hello')

}

표현식 

const(let) sayHello = function() {

console.log('sayHello!!')

]

▶block scope (블록 영역 { })

 : 중괄호로 선언된 내부 영역을 뜻하며 보통 함수를 선언 할 때 subset로 중괄호가 쓰이곤 합니다. 

[nested scope]

 : 함수 내부에 함수가 선언되면 내부에 선언된 함수는 외부의 함수의 변수에 접근이 가능해 집니다. 이것을 lexical scoping 라고 하는데 이때 외부 함수는 내부 함수에 접근 할 수 없습니다.

이 nested scope 를 이해 하셨다면 아시겠지만, 이 nested scope가  바로 closure 입니다.

[closure( 클로져 )]

 : closure 를 사용하는 이유는 크게 두 가지 입니다. 첫번째, side effect 에 사용하기 위해 / 두 번째 private 변수를 선언 하기위해, 이 두가 지 이유 입니다.

1. side effect 제어

 : 함수가 작동 할 때 생기는 외적인 효과를 말합니다.(ex. Ajax) 

nested scope 영역의 특성으 이용하여 함수 내부에 선언된 내부 함수를 이용하여 손쉽게 값을 변경하고 함수값을 참조 하기 위함 입니다. 외부 합수의 값을 내부 함수로 선언 하고 외부 함수를 외부의 변수로 선언 했을 때, 내부 함수의 값을 지속적으로 바꿔 재설정 하면서 side effect를 제어 하여 사용 할 수 있습니다.

이렇게 외부에서 사용 쉽게 사용되는 장점이 있지만 외부 함수의 환경을 지속적으로 기억하고 있기때문에 메모리의 사용량이 늘어난다는 단점이 있습니다. 

그렇기 때문에 사용이 모두 종료 되면 삭제하는 방법을 권장한다고 합니다.

function hello(name) {

    return function() {

        return name + age;

}

let who = hello(JK);

 who = 30;  

console.log(who) // => JK30

 who = 50;

condole.log(who) // => JK50

2. private 변수 선언

 : 외부에서 내부 함수에 접근하여 영향을 미칠 수 없기때문에 closure 로 생성된 내부 함수의 변수는 private 변수라고 부릅니다. 

global scope 

local scope( function / block ) : global, local 영역의 변를 사용

nested scope ( closure )

: global, local, closure 영역의 변수를 사용 

※관련된 내용이 더 많으며 최대한 이해한 만큼 축약해놓은 자료로써 더 공부해서  

추후, 꼭 수정 및 업데이트를 하자!!