함수란 무엇인가

이 글에는 이해를 돕기 위한 거짓말이 조금 포함되어 있습니다.

방금 무슨 일이 일어난거지?

우리는 방금 마법같은 일을 경험했습니다. 한 줄의 코드로 원을 그렸기 때문이죠.

function setup() {
  createCanvas(400, 400);
}

var pos_x = 30;

function draw() {
  background(220);
  circle(pos_x, 30, 20); // <-- 이 자리
  pos_x++;
}

저 circle()이 뭐길래 원을 그리는 걸까요?
저렇게 뒤에 괄호가 붙은 것을 우리는 함수라고 합니다. 잘 보시면 setup()도 draw()도 뒤에 괄호가 붙어있죠? 그것들도 함수입니다.
function이 애초에 함수라는 뜻입니다 ^^;
변수 구성할 때 <종류> <이름>이었던 것을 겹쳐보신다면 더 체감이 되실겁니다. 함수는 종류가 함수로 선언되어있습니다. 구성상 괄호가 따라 붙는 것이구요.

함수가 그래서 뭐에요?

학생 때 배웠던 원의 방정식을 기억하시나요?

x^2 + y^2 = r^2

이 함수를 사용하면 좌표 중심에 원을 그릴 수 있었습니다.
그리고 이것은 수학이니, 우리가 컴퓨터에서 숫자를 잘 다루면, 컴퓨터에서 원을 그릴 수도 있을 것 같습니다. 화면에 원을 그릴 땐 위치나 크기 뿐 아니라 선의 색상, 원의 색상 등 원을 표현하는 방식도 필요하니 좀 더 다양하고 복잡한 모양새가 되겠죠. 그러니 원을 그리고 싶다면…

// --- 여기부터 ---
// 원의 중심점 설정
// 원의 크기에 따라 동그랗게 그리기
// 원의 선 색상을 검정색으로 하기
// 원의 안쪽 면 색상을 흰 색으로 하기
// ... 기타 원에 관련된 설정들 잡기
// --- 여기까지 작성하면 원 그리기 완성 ---

실제 코드를 적어내려가면 복잡할 것 같아서 간략하게 썼는데도 저렇게 최소 4줄 이상을 작성해야 원을 그릴 수 있게 됩니다. 코드에서 원을 그려야하는 순간들마다 4줄씩 복사/붙여넣기하여 크기나 위치 같은 다른 값들만 수정하는 방식을 생각해보세요. 코드가 순식간에 정신없이 길어질 겁니다. 원을 10개만 그려도 코드는 40줄…!

편하게 반복하기

좀 더 관리하기 편한, 가독성이 좋은 코딩을 하기 위해 생겨난 것이 함수입니다.

function circle() {
    // 원의 중심점 설정
    // 원의 크기에 따라 동그랗게 그리기
    // 원의 선 색상을 검정색으로 하기
    // 원의 안쪽 면 색상을 흰 색으로 하기
    // ... 기타 원에 관련된 설정들 잡기
}

이런 식으로 양식에 맞추어 원 그리기 함수를 구성한 후에

circle(); // circle() 함수에 구성된 행동을 그대로 실행하기

이런 방식으로 호출하면 저 함수에 작성한 것들을 동일하게 동작시켜줍니다.

와 !
이제 원을 10개 그릴 때 코드를 40줄 쓰지 않고 10줄만 써도 되요!

비슷하지만 다를 수 있게

하지만 위와 같은 방식으로 함수를 구성하면 단점이 있습니다.
모두 같은 좌표 중심에, 같은 크기, 같은 속성의 원을 그리게 됩니다. 함수에 적혀있는 내용은 고정적이고 프로그램을 재생할 때 우리가 임의로 수정할 수가 없으까요. 그래서 사람들은 생각했습니다. 함수 중 일부는 변수로 구성될 수 있지 않을까 하고 말이죠.

function circle(position_x, position_y) {
    // 원의 중심점 설정 (중심점은 받아온 position_x, position_y 값에 영향받음)
    // ...
}

이런 식으로 괄호 안에 인자를 받아 함수에 사용되는 값을 직접 변경할 수 있게 구성하는 겁니다. 그러면 여전히 원을 그릴 때 함수 한 줄로 그릴 수 있지만 각 원마다 변화를 주기도 쉬워집니다.

circle(0, 0); // 좌표 중심에 원 그리기
circle(10, 10); // (10, 10) 자리에 원 그리기
...

우리가 사용한 circle() 함수는 원의 지름까지 받았었죠? 같은 방식으로 지름 인자를 추가한 것이라 생각하시면 됩니다.

코드 블럭

함수에서 괄호 뒤에 {} 이런 중괄호도 사용했는데, 이것은 코드 블럭입니다. 코드 묶음 정도로 생각하면 됩니다. 이 코드 블럭은 코드의 지역 구분을 의미하는데 이건 다음에 따로 설명하도록 할께요.