[javascript 언어공부] 함수(1)

이번시간에는 함수에 대해서 배워보자.

함수는 영어로 function이다.

프로그래밍에서의 함수는 수학에서의 함수와 똑같은 개념이다.

하지만 수학에서의 함수와 프로그래밍에서의 함수는 

개념은 같지만 중요시 여기는 부분은 다르다.

프로그래밍에서 함수의 가장 중요한 역할은,

하나의 로직을 재실행 할 수 있도록 하는 것으로 코드의 재사용성을 높여준다는 것이다.

재사용성이란 자신이 작성한 코드를 여러 맥락에서 다시 사용할 수 있도록 하는 것이다.

하나의 코드를 여기 저기서 사용할 수 있게 된다는 것의 이점은

코드를 작성하는 시간이 줄어드는 것이고, 코어 코드가 개선되면, 이것을 사용하는 모든 코드가 개선된다는 좋은 점이 있다.

따라서 함수를 공부하며 가장 주목할 것은 재사용성이며,

이 재사용성이 어떻게 달성되는가에 대해서 감을 잡는 것이 중요하다.

함수의 형식을 보자.

function 함수명( [인자...[,인자]] ){

   코드

   return 반환값

}

우선 시작은 function으로 시작한다. 

조건문은 if로 시작했고, 반복문은 for나 while로 시작했던 것과 같이

함수 또한 약속된 키워드 function으로 시작된다.

function다음엔 함수에 이름이 나오고, 그 이후에 괄호와 괄호, 중괄호와 중괄호가 나온다.

나중에 함수의 이름을 이용해서

중괄호에 들어가 있는 구간에 해당하는 코드를 

언제든지 재실행 할 수 있는 기능이 바로 함수이다.

문법만으로는 함수가 무엇인지 체감하기 힘드니 직접 함수를 만들어보자. 

function numbering(){

document.write(1);

}

이렇게 해서 함수를 정의했다.

마치 변수를 사용하려면 변수를 먼저 정의하고

갚을 할당한 다음

그 변수를 호출하는 것과 같다.

함수도 비슷하게, 함수를 정의하고

함수를 호출하면 된다.

함수를 호출하는 방법은 다음과 같다.

함수명();

numbering();

이것을 호출해보면 브라우저에 숫자 1이 출력된다.

이는 numbering(); 이라는 것을 읽으면 컴퓨터는 numbering이라는 명칭을 가진 함수를 찾는다.

이후 중괄호 안의 것을 실행하는 것이다.

만약 이것을 6번 호출한다면, 

numbering();

numbering();

numbering();

numbering();

numbering();

numbering();

브라우저에는 111111이 출력될 것이다. 

그렇다면 좀 더 복잡한 코드를 보자. 

function numbering(){

    i = 0;

    while(i < 10){

        document.write(i);

        i += 1;

    }   

}

이 함수를 실행시키면 0부터 9까지 브라우저에 출력된다.

이 함수를 여러번 실행하게 되면 역시, 

numbering();

numbering();

numbering();

012345678901234567890123456789 가 브라우저에 실행될 것이다.

앞서 함수는 재사용성이 좋다고 했는데, 함수 안의 숫자를 바꾼다면, 

function numbering(){

    i = 0;

    while(i < 30){

        document.write(i);

        i += 1;

    }   

}

이 numbering이라는 함수를 사용하는 모든 곳에서 변경이 반영 된다.

이것이 재사용성이 높을 때 우리가 얻는 효용이다.

이번에는 '함수가 없다면'이라는 질문을 통해 함수의 효용성에 대해 다시 한번 확인해보자. 

만약, 함수가 없다면

0부터 9까지 작성하는 코드를 작성하라면, 

    i = 0;

    while(i < 930){

        document.write(i);

        i += 1;

    }   

이렇게 할 것이고, 3번 작성해야 한다면 

    i = 0;

    while(i < 30){

        document.write(i);

        i += 1;

    }   

    i = 0;

    while(i < 30){

        document.write(i);

        i += 1;

    }   

    i = 0;

    while(i < 30){

        document.write(i);

        i += 1;

    }   

이렇게 작성하게 될 것이다. 

그리고 만약, 반복문의 조건이 바뀌게 돼서, i < 30으로 바뀐다면 

이 안에 있는 모든 숫자를 바꿔줘야 한다.

이런 경우에 함수를 쓰게 되면, 

function numbering(){

    i = 0;

    while(i < 30){

        document.write(i);

        i += 1;

    }   

}

numbering();

numbering();

numbering();

이렇게 실행하면 된다. 

하지만 만약 함수를 1000번 호출해야 한다면 어떻게 할까? 

for(var i=0;i<1000;i++){

 numbering();

}

이렇게 실행해도 되고, 

for(var i=0;i<1000;i++){

    i = 0;

    while(i < 30){

        document.write(i);

        i += 1;

    }   

}

이렇게 사용할 수도 있다. 

그렇다면 그냥 반복문을 사용해도 되는 것이 아닌가?

대체 반복문이 갖고 있는 효용과 함수의 효용은 어떤 차이가 있을까?

반복문은 기계적으로 일정한 반복을 그 자리에서 실행할 때 의미가 있고, 

함수는 반복적으로 실행되는 로직이 여러가지 맥락에서 반복돼서 사용되는 경우에는 함수가 의미가 있다.

즉 반복문 같은 경우는 그자리에서 1000번 실행되는 것이지만,

함수는 여러가지 맥락에서 여기저기서 호출돼서 실행되는 것이다. 

함수는 재사용성이 좋다고 했는데, 이처럼 어떤 코드가 여러곳에서 사용될 수 있을 때 재사용성이 좋다고 말하며, 

조금 말로 이야기하면 함수를 만드는 것은 좋은 부품을 만드는 것과 같다. 

재사용성이 높아지면

이 함수를 사용하고 있는 여러곳에서

이 함수의 내용을 수정,변경,개선할 때

하나의 함수의 내용을 수정하면 되는 것이다.

이러한 특성을 유지보수가 용이하다고 한다. 

또 코드의 가독성이 좋아질 수 있다.

numbering(); 이라는 한줄의 로직은 사실 다음과 같은 긴 코드이다. 

    i = 0;

    while(i < 30){

        document.write(i);

        i += 1;

    }   

만약 함수를 사용하지 않고 이렇게 긴 코드가 곳곳에 있다면

이 긴 코드를 모두 읽고 나서야

어떤 코드가 어떤 코드와 같은지 알 수 있을 것이다.

함수를 사용하는 것은 똑같은 이름의 코드를 사용하는 것이고, 

똑같은 이름의 코드는 같은 취지, 같은 구성, 같은 기능을 가졌다는 것을 확신할 수 있게 된다.

또 함수를 사용하게 되면 유지보수가 용이하게 되는데, 다른 사람이 코드를 짤 때,

'아 그건 numbering이라는 함수를 사용하면 되고, 그 함수는 어떤 결과를 냅니다'라는 것을 알려주기만 하면

그 함수 내의 기능을 알지 못해도 함수를 호출하면 그 기능을 사용할 수 있게 된다.

정리해보자면 함수는

1. 재사용성

2. 유지보수의 용이

3. 가독성

면에서의 용이한 점이 있다.

프로그래밍에서 이러한 것들은 매우 중요한 것으로, 프로그래밍 언어가 발전하는 방향은

이러한 것들을 높이기 위한 방향으로 발전하고 있다.