자바스크립트 : 함수 function

함수

function 함수명(매개변수){
수행할 동작;    }

 

함수를 생성하기 위해 function을 이용한다. 리턴값이 있을 경우에는 return 리턴값; 으로 추가해주면 된다.

 

 

        function sum(a,b){
            return a+b;
        }
        document.write(sum(),"<br>") //NaN
        document.write(sum(10),"<br>") //NaN
        document.write(sum(10,20),"<br>") //30

숫자 2개를 더하는 함수를 생성했다. 10, 20을 넣어주었을 때는 30으로 결과가 나온다.

입력값이 지정한 것보다 부족하거나 없을 때는 숫자가 아니라는 NaN이 리턴된다.

 

 

        function sum(a=0,b=0){
            return a+b;
        }
        document.write(sum(),"<br>") //0
        document.write(sum(10),"<br>") //10
        document.write(sum(10,20),"<br>") //30

a=0, b=0으로 기본값을 설정해줄 수 있다.

sum(10)처럼 하나의 값만 입력되었을 때는 왼쪽부터 대입되고, a가 10이 되고 b는 기본값 그대로 0인 상태로 합이 return 된다.

 

 

        function sum(a,b){
            if(a==undefined)
            a=0;
            if(b==undefined)
            b==0;
            return a+b;
        }
        document.write(sum(),"<br>") //0
        document.write(sum(10),"<br>") //10
        document.write(sum(10,20),"<br>") //30

기본값을 지정해주는 대신, 값이 undefiend일 때 조건을 지정해 줄수도 있다.

 

 

 

  <button onclick="forword()">앞으로가기</button>
  <script>
    function forword(){
      history.forward();
    }
  </script>

이벤트 = "함수"로 특정 이벤트에 함수를 실행 할 수 있다.

버튼을 클릭했을 때 forword() 함수를 실행한다. foword 함수는 history.forward로 앞으로가는 동작이 적용되어 있다.

history.back()으로 뒤로가기 동작을 함수에 넣어줄 수도 있다.

 

 

익명함수

익명함수는 말그대로 함수명이 없다. 특정 이벤트를 처리하는 용도로 만들어 변수에 저장한다.

변수에 함수를 저장하면 변수명이 함수명으로 쓰인다.

 

 

	var func = function() {
            alert('익명함수 실행');
        }
        func();

function 옆에 함수명이 들어가는 자리에 아무것도 없다. 대신에 func라는 변수에 함수를 저장하고, 변수명으로 함수를 실행할 수 있다.

 

 

 

괄호 함수

() => { 수행 내용 }

        var f = () => {
            alert('괄호 함수');
        } 
        f();

람다식과 비슷하다. => 를 이용해서 괄호함수를 만들어 변수에 저장했다. 변수명으로 함수를 실행할 수 있다.