Top

함수

변수에는 데이터만 저장할 수 있고, 코드는 저장할 수 없습니다. 하지만 함수를 사용하면 코드를 메모리에 저장했다가 필요할 때 마다 호출하여 사용할 수 있습니다. 예를 들어 다음 그림의 TV 리모컨을 보면 각 채널의 버튼이 있습니다. 그리고 각 버튼에는 TV의 해당 채널로 바꿀 수 있는 코드가 저장되어 있죠. 이 코드는 사용자가 리모컨의 버튼을 눌러(호출)야만 실행됩니다. 이때 각 TV 리모컨의 버튼은 함수를 저장하고 있으며 버튼을 누를 때마다 함수가 호출 된다고 할 수 있습니다.

쉽게 말해, 함수란 한 마디로 프로그램의 코드를 저장한 공간이라고 할 수 있습니다. 함수를 사용하면 코드를 메모리에 저장했다가 필요할 때마다 호출하여 사용할 수 있죠.

선언적함수 

function(){
    자바스크립트 코드;
}함수명;

위와 같은 함수를 선언적 함수라고 하며, 함수를 만드는 일반적인 방식으로 익명 함수와 달리 특정한 이름을 가지고 있습니다. 함수를 사용하여 코드를 저장한 것을 '함수 정의문'이라고 한다. 변수를 선언할 때 var 키워드를 사용한 것처럼 함수에서는 funciton 키워드를 사용해 변수를 선언한다.

익명함수 

참조변수=function(){
            자바스크립트 코드;
            }

위처럼 함수명이 없는 함수를 익명함수라고 합니다.

아래 예제는 선언적 ㅎ마수와 익명 함수를 변수에 참조한 예 입니다.

<script>
    var count = 0;

    myFnc();

    function myFnc() {
        count++; 
        document.write("hello" + count, "<br>");
    }
    myFnc(); 
    var theFnc = function() {
        count++;
        document.write("bye" + count, "<br>");
        }

    theFnc(); 
</script>

매개변수 함수

기본 함수 정의문은 함수 안에 있는 코드를 실행할 때 단순히 함수명으로 호출해서 코드를 실행했습니다. 즉 함수를 호출할 때 값을 전달할 수 없었습니다. 하지만 매개변수가 있는 함수 정의문은 함수를 호출할 때 전달하고자 하는 값을 입력하여 호출할 수 있습니다. 이렇게 전달된 값은 매개변수가 받아 함수 정의문에서 사용할 수 있게 됩니다.

다음은 함수를 호출할 때 값을 전달하는 기본형입니다.

<script>
    function myFnc(name, area) {
        document.write("안녕하세요." + name + "입니다", "<br>");
        document.write("사는 곳은" + area + "입니다", "<br><br>");
    }

    myFnc("홍당무", "서울");    //안녕하세요. 홍당무입니다.
                                //사는 곳은 서울입니다.
    myFnc("깍두기", "부산");    
<script>

리턴값 함수

function 함수명() {
  자바스크립트 코드; - ②
  return 데이터(값); - ③

  자바스크립트 코드2; - ①
}

var 변수 = 함수명();

return 문은 함수에서 결괏값을 반환할 때 사용합니다. 그리고 함수에서 return 문이 실행되면 반복문의 break 문과 비슷하게 코드가 강제로 종료됩니다. 다시 말해 함수 정의문에 return문이 사용되면 함수를 호출했을 때 결괏값을 반환합니다.

쉽게 말해, 함수를 호출했던 위치로 되돌아가라는 의미라고 보면 되겠습니다.

기본형

function 함수명(){
    자바스크립트 코드1;
    return 데이터(값);

    자바스크립트 코드2;
}
var 변수 = 함수명();
예시 
<script>
functoin testAvg(arrData){
    var sum = 0;
    for (var i = 0; i < arr data.length; i++){
        sum += Number(prompt(arrData[i] + "점수는?", "0"));
    }

    var arrSubject = {"국어", "수학"};
    var result = testAvg(arrSubject);

    document.write("평균점수는" + result + "점입니다");
<script>