웹개발 및 최신 테크 소식을 전하는 블로그, 웹이즈프리
자바스크립트의 자기실행함수(self-invoking function)은 세가지로 사용할 수 있다는 것을 알고 있다. 그런데 괄호를 사용하는 방법과 느낌표 ! 를 사용하는 방법이 정말 완전히 동일한 것일까? 아니면 어떤 차이점이 있을까?
이 의문은 클로저를 만들기 위해 함수를 사용해 다른 함수를 리턴하던 중 다른 결과가 나왔기 때문에 적어본다. 일단 아래의 코드를 보면 두 개의 자기실행 함수를 적어보았다.
위 코드는 동일하게 작동할 것으로 기대했는데 그 결과는 조금 달랐다. 각각의 결과는 아래와 같았는데...
이유는 좀 더 확인해 볼 필요가 있겠지만 중요한 것은 함수를 리턴값으로 반환할 경우 자기실행함수의 두 가지 방법이 차이점을 갖는다는 것이다. 원래의 원하는 결과는 불리언이 아니기 때문에 괄호를 사용한 방법이 원했던 방법이다.
이 의문은 클로저를 만들기 위해 함수를 사용해 다른 함수를 리턴하던 중 다른 결과가 나왔기 때문에 적어본다. 일단 아래의 코드를 보면 두 개의 자기실행 함수를 적어보았다.
// 느낌표를 사용한 자기실행함수
add = function(num) {
return ! function () {
return ++num;
}();
}
// 소괄호를 사용한 자기실행함수
add = function(num) {
return (function () {
return ++num;
})();
}
add = function(num) {
return ! function () {
return ++num;
}();
}
// 소괄호를 사용한 자기실행함수
add = function(num) {
return (function () {
return ++num;
})();
}
위 코드는 동일하게 작동할 것으로 기대했는데 그 결과는 조금 달랐다. 각각의 결과는 아래와 같았는데...
// 느낌표 사용한 경우
add(1)
false를 반환
add()
true를 반환
// 괄호를 사용한 경우
add(1)
숫자 2를 반환
add()
NaN을 반환
add(1)
false를 반환
add()
true를 반환
// 괄호를 사용한 경우
add(1)
숫자 2를 반환
add()
NaN을 반환
이유는 좀 더 확인해 볼 필요가 있겠지만 중요한 것은 함수를 리턴값으로 반환할 경우 자기실행함수의 두 가지 방법이 차이점을 갖는다는 것이다. 원래의 원하는 결과는 불리언이 아니기 때문에 괄호를 사용한 방법이 원했던 방법이다.
아래의 글도 찾고 계시지 않나요?
