본문 바로가기
JavaScript

[JavaScript] 자바스크립트 함수

by byeongoo 2019. 5. 23.

1. 함수

함수(function)란 하나의 로직을 재실행 할 수 있도록 하는 것으로 코드의 재사용성을 높여줍니다. 자바스크립트에서 함수를 사용하는 문법의 형태는 다음과 같습니다. 

function 함수명( [인자...[,인자]] ){
   코드
   return 반환값
}

 

함수는 function 뒤에 함수의 이름이 오고, 소괄호가 따라온다. 소괄호에 인자라는 값이 차례로 들어오는데 이 값은 함수를 호출할 때 함수의 로직으로 전달될 변수입니다. 인자는 생략 할 수 있다. 함수를 호출 했을 때 실행하게 될 부분이 중괄호 안쪽에 옵니다. 예제를 살펴보겠습니다. 이 함수의 이름은 numbering이고, 내용은 0부터 9까지를 화면에 출력합니다.

function numbering(){
    i = 0;
    while(i < 10){
        document.write(i);
        i += 1;
    }   
}
numbering();

 

2. return

함수 내에서 사용한 return은 return 뒤에 따라오는 값을 함수의 결과로 반환합니다. 동시에 함수를 종료시킵니다. 아래 내용을 보겠습니다. 결과는 egoing과 k8805입니다.

function get_member1(){
    return 'egoing';
}
 
function get_member2(){
    return 'k8805';
}
 
alert(get_member1());
alert(get_member2());

 

3. 인자란?

인자(argument)는 함수로 유입되는 입력 값을 의미하는데, 어떤 값을 인자로 전달하느냐에 따라서 함수가 반환하는 값이나 메소드의 동작방법을 다르게 할 수 있습니다. 다음 예를보면 결과는 1,2입니다.

function get_argument(arg){
    return arg;
}
 
alert(get_argument(1));
alert(get_argument(2));

5행의 get_argument(1)은 1행에서 3행 사이에 정의된 함수를 실행하는 구문입니다. 5행의 1은 get_argument로 1이라는 값을 전달하겠다는 의미입니다. 이 때 1행에 정의된 (arg) 구문에 의해서 변수 arg의 값으로 숫자 1이 함수 안으로 전달됩니다. 이 변수 arg는 함수 get_argument 안에서만 유효합니다. 복수의 인자를 쓸 때는 다음과 같이 만들면 됩니다.

function get_arguments(arg1, arg2){
    return arg1 + arg2
}
 
alert(get_arguments(10, 20));
alert(get_arguments(20, 30));

 

4. 함수를 정의하는 다른 방법

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

var numbering = function (){
    i = 0;
    while(i < 10){
        document.write(i);
        i += 1;
    }   
}
numbering();

'JavaScript' 카테고리의 다른 글

[JavaScript] 객체  (0) 2019.05.28
[JavaScript] 자바스크립트 배열  (0) 2019.05.23
[JavaScript] 반복문  (0) 2019.05.23
[JavaScript] 조건문  (0) 2019.05.23
[JavaScript] 비교 연산자(==, ===)  (0) 2019.05.23