[javaScript] 자기호출 익명함수란?

자바스크립트를 사용하다보면 자기 호출 함수를 사용해야 하는 경우가 있습니다.

자기 호출 함수를 처음 보시는 분은 생소할수 있습니다.

자기호출 함수란 자기 스스로를 호출하는 함수 입니다.
자기호출 익명함수란 함수 이름이 없고 자기 스스로를 호출하는 함수라고 할수 있죠.

자기호출 익명함수는 크게 두가지 모양으로 사용할수 있습니다.

1.
!function(){}();

2
function(){}();

좀더 정확하게 말하면 호출 방법은 하나입니다.
function앞에 !가 붙어있는 모습을 볼수 있는데
!을 붙이게 되면 자기함수 호출의 return값의 반대값을 돌려주게 됩니다.
!을 붙이지 않으면 리턴값은 없습니다.

1. 예제 ( !function(){}(); )

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Document</title>
</head>
<body>
   <script>   
 
       for(var i=0;i<3;i++)
       {
            var a = !(function(i){            
              setTimeout(function(){
                   alert(i);
               },0);
                
              return true;    
              }
            )(i);           
           alert(a + "!!");
       }       
       
   </script>
</body>
</html>
Colored by Color Scripter
cs

- 1. 예제 출력결과

false!! false!! false!! 0 1 2 가 나옵니다
물론 0 1 2 의 경우 순서가 반대일수 있습니다.
setTimeout의 경우 예약함수라 호출순서를 장담할수 없습니다.

2. 예제 ( function(){}(); )

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Document</title>
</head>
<body>
   <script>   
 
       for(var i=0;i<3;i++)
       {
            var a = (function(i){            
              setTimeout(function(){
                   alert(i);
               },0);}
            )(i);           
           alert(a + "!!");
       }       
       
   </script>
</body>
</html>
Colored by Color Scripter
cs

- 2. 예제 출력결과

undefined!! undefined!! undefined!! 0 1 2 이렇게 나옵니다.

저작자표시

'프로그래밍 > JavaScript' 카테고리의 다른 글

[JavaScript] new 키워드를 사용한 생성자 (0)	2018.11.18
[JavaScript] 선언적 함수와 익명 함수 호출순서 (0)	2018.11.12

Sw.Dev