[펌] 자바스크립트 정리. 3 - 자바스크립트 함수

검색엔진을 뒤지면서 보다가 너무나 깔끔하게 정리된

자바스크립트가 있기에 퍼옴. GENERAL 님의 정리 감사합니다.

댓글은 아래 링크에 달아주시기 바랍니다. 저도 고맙게 생각하는지라.^^;;

링크 : http://blog.naver.com/minis24/80094251902

* 자바스크립트를 공부하면서 노트에 정리해 놓은 내용을 보기 편하고, 효율적으로 검색하기 위해

  블로그에 올리고 있습니다.

* 괜찮게 생각했던 내용과 메서드나,프로퍼티등의 인덱스가 있었으면 해서 정리한 거라서

   아주 기초적인 내용은 없을지도 모르겠네요. ^^ 

* 오늘은 자바스크립트 함수와 관련된 내용입니다.

 

 

* function

   - 함수 정의는 프로그램의 정적인 구조를 나타낸다.

   - 자바스크립트에서 문장은 실행시간에 실행되는 반면

      함수는 실행되기 이전의 문서 파싱단계에서 정의된다.

 

   - 자바스크립트 파서가 함수정의를 만나면 함수정의 문장들을 파싱하고 저장만 해놓는다.

  

   ex )

     alert ( f( 4 ) ) ;   // 16 출력

     var f = 0 ;        // f를 덮어쓴다.

     

     function f( x ) { return x * x ; } ;        // 함수를 정의 (문서파싱단계에서 저장되므로)

                                                         // 정의보다 앞에서 호출할 수 있다. 

     alert ( f )        // 0을 출력한다.

 

 

* Function() 생성자 

   Function()생성자를 사용해서 함수를 정의할 수 있다.

   Function()생성자는 임의 갯수의 전달인자를 전달 받는다

   Function()생성자의 마지막 문자열은 함수의 몸체 이다.

 

      --> 이름 없는 함수를 생성한다.

      --> 생성된 함수는 어휘적 유효범위를 사용하지 않는다.

            최상위 레벨의 함수인것처럼 컴파일된다.

 

   ※ 어휘적 유효범위란..

        자바스크립트가 기술된 유효범위를 말한다.

        여기서의 의미는 함수의 내부에서 정의 되었을 지라도

        최상위 레벨의 함수인것처럼 컴파일 된다는 뜻이다..

     

        ex)      

   var f = new Function("x","y","return x*y ;") ;

   이것은 아래와 같다.

   function f( x , y ){

      return x * y ;

   }

 

 

* 함수의 리터럴

    

   함수를 데이터로서 아래와 같이 다양한 방식으로 사용하는것이 가능합니다.

 

    var f = function fact(){

        if ( x <= 1 ){

           return 1;

        }else { 

           return x * fact ( x-1 );

        }

    }

 

   # 변수 f 에는 함수의 참조값을 가지고 있습니다.^^

     이때 fact 에 함수에 대한 참조를 저장하지는 않지만..

     위의 예처럼 함수의 몸체에서 자신을 참조하기 위해 식별자를 사용하는것은 허용합니다.

 

 

   # 아래의 예처럼 이름없는 함수를 정의해서 배열에 저장할 수 있습니다.  

     f[0] = function(x) {

                return x * x ;

             }

 

   # 함수를 정의하여 다른 함수에 전달할 수도 있습니다.

     a.sort( function (a,b){ return a - b ;});

 

   # 함수를 정의하여 바로 호출 하기

     var fx = (function (x) { return x ; })(10) ;

 

* 함수의 전달인자

   - 자바스크립트는 타입제약이 느슨하므로, 자신이 받기를 기대하는 전달인자의 데이타

      타입을 미리 선언하는 것이 불가능하다.

 

    - 전달 받을 수 있는 갯수는 함수를 정의할때 이름붙은 전달인자의 갯수와는 상관이 없다.

      함수정의할때는 전달인자를 선언해 줘도 좋고 안해줘도 좋고..아무런 상관이 없습니다.

      하지만 항상 넣어주는것이 정확히 선언해 주는게 보기에는 좋겠죠...

 

    - BUT 첫번째 인수를 생략하고, 두번째 인수를 전달할 수는 없으므로, 첫번째에는 적당한 인자를

      넣어줘야한다..(null 등..)

 

    - 함수 정의시 선언된 전달인자의 갯수보다 적은 수의 전달인자와 함께 호출되면 ,지정되지 않은

      남은 전달인자는 undefined 가 된다.

 

    - 호출 당시 생략되거나, null 값인 전달인자에 대해 적당한 기본값을 할당해 줘야

       에러가 발생하는것을 방지할 수 있다.

 

function copyFx ( obj ,/* option */ a) {      //option 은 주석이고, a값은 옵션이라는것 표시

    if( !a) a=[] ;                                       // a 가 정의되지 않거나 null 이면 빈배열 

    for (var property in obj ) {

       a.push( property );

    }

   

    return a ;

}

 

var a = copyFx( obj ) ;                            // a를 전달하지 않으면, obj의 모든 프로퍼티를

                                                           // 새배열에 넣는다.

copyFx ( obj ,a );

 

* 전달인자 객체 ( Arguememts 객체 프로퍼티 arguements )

    - arguements : Arguements 객체를 참조하는 특별한 프로퍼티

   

      자바스크립트 함수는 고정된 전달인자들로 정의되지만, 호출시점에서는 고정된 갯수와는

      상관없이 임의 갯수의 전달인자를 전달받을 수 있다.

 

      이 때 Arguements 객체를 통해 전달인자에 접근할 수 있다.

     

           첫번째 전달인자   --> arguements[0] 

           두번째 전달인자   --> arguements[1]

           전체 전달인자의 갯수  --> arguements.length