begining functional javascript 4장 클로저

*begining functional javascript -(에이콘 출판사)를 읽고 공부한 내용을 바탕으로 작성한 글입니다.

 

자바스크립트에서 클로저(closure)란 함수 안의 함수이다. 

아래의 outer 함수와 같은 형태가 바로 클로저이다. 

const outer = () => {
	const inner = () => {}
    return inner
}

이러한 형태의 함수 이름이 closure인 이유는 함수가 처음 실행 될 당시의 스코프를 포섭(closure)하여 이후에 실행할때 이용하기 때문이다.

const outer = (num) => {
	const inner = (num) => {console.log(num)}
    return inner
}

const example = outer(4)
example()

위의 코드에서 example()를 실행 시키면, 콘솔창에 4가 찍히게 된다.

이것이 바로 closure라는 이름이 붙은 이유이다. 

 

이를 조금 더 응용하면 클로저를 활용해서 private method를 흉내 낼 수 있다.

const Calculator = () => {
	let num = 0;
    
    const Plus = () => {num+=1;}
    const Minus = () => {num-=1;}
    const LogNumber = () => {console.log(num)}
    return {
    Plus,
    Minus,
    LogNumber
    }
}
const c = Calculator()
c.LogNumber()
c.Plus()
c.LogNumber()

 

주어진 함수를 한 번만 실행할 때 사용할 수 있는 once 함수

const once = (fn) => {
	let done = false;
    	return ()=>(done ? undefined : ((donw = true), fn.apply(this, arguments))
    }

apply, call 과 같은 함수에 대한 이해를 하느라 꽤 헤맸는데, 좋은 글을 찾아 공유합니다.

https://www.zerocho.com/category/JavaScript/post/57433645a48729787807c3fd

* 다음에 정리할 것 apply, call, bind

* Object.entries 함수 ->  메서드는 for...in와 같은 순서로 주어진 객체 자체의 enumerable 속성 [key, value] 쌍의 배열을 반환합니다. (for-in 루프가 다른점은 프로토 타입 체인의 속성도 열거한다는 점입니다). from Mdn