[JavaScript] 함수 정의하는 방법

함수 정의하는 방법

1. 일반적인 방법

함수는 function 뒤에 함수의 이름이 오고, 소괄호가 따라온다. 소괄호에 인자라는 값이 차례로 들어오는데 이 값은 함수를 호출할 때 함수의 로직으로 전달될 변수다. 

인자는 생략 할 수 있다. 함수를 호출 했을 때 실행하게 될 부분이 중괄호 안쪽에 온다.

다음 예제를 보자. 이 함수의 이름은 numbering이고, 내용은 0부터 9까지를 화면에 출력한다.

function numbering(){

    i = 0;

    while(i < 10){

        document.write(i);

        i += 1;

    }   

}

numbering();//함수 호출문장

2. 함수를 변수에 대입하는 방법

자바스크립트는 함수를 정의하는 또 다른 방법을 제공한다. 다음 예제를 보자. 아래 방법은 함수를 정의 하는 또 다른 방법이다.

var numbering = function (){

    i = 0;

    while(i < 10){

        document.write(i);

        i += 1;

    }   

}

numbering();

우항의 함수 정의 문이 좌항의 변수에 대입된 모습/ numbering이란 변수가 함수를 갖게 된다.

numbering();// 변수명으로 호출하는 모습

3. 익명함수

(function(){

 i = 0;

    while(i < 10){

        document.write(i);

        i += 1;

    }   

})();

정의된 함수를 '( )'로 묶고 호출할 때 사용하는 기호인 ( )붙이면 이 함수를 정의하는 것과 정의하는 함수를 바로 호출하는 것을 하나의 문장으로 표현할 수 있다.

--> 익명함수(이름이 필요없고 바로 호출되었기 때문이다.함수를 정의한 후에 바로 호출할 때 괄호 사용(익명함수 사용이유)) 즉, 일회성으로 호출할 때 사용하는 테크닉!!

cp.) 익명함수는 이름이 없기 때문에 주로 변수에 할당되거나 함수 인자의 값 또는 반환값으로 사용된다.

var v = function(x,y){return x+y;};

익명함수를 변수에 할당하는 코드로서, 위 문장을 확장하면 객체의 메서드를 정의하는 방식으로 사용할 수 있다.

o.func(function(x,y){return x+y;});

다른 함수의 인자값으로 익명 함수를 정의해서 전달하는 코드이다. 위 문장을 확장하면 콜백 함수 및 이벤트 핸들링 구조를 구현할 수 있다.

var added = (function(x){return x+y;})(1,2);

익명함수를 정의한 다음 바로 호출하는 구조이다. 익명함수를 이런식으로 호출하는 것은 단 한번 밖에 할 수 없다. 이런 예를 확장해서 프로그램이 시작할 때 스스로 호출되는 자체 호출 함수구조를 표현할 수도 있다.