관리 메뉴

클라이언트/ 서버/ 엔지니어 "게임 개발자"를 향한 매일의 공부일지

함수와 이벤트 3 - 함수 알아보기 본문

웹 · 앱 개발/자바 스크립트

함수와 이벤트 3 - 함수 알아보기

huenuri 2024. 11. 20. 15:56

이제 책으로 돌아와서 함수에 대한 공부를 시작해보려고 한다. 요즘 공부에 대한 체력과 열정이 많이 떨어져서 힘이 많이 부치는 편이다. 아니면 정말 하고 싶지 않은 두 마음을 갈등이 많이 된다. 그래도 오후에 조금이라도 힘을 내서 공부를 시작해보고 있다. 지루할 때는 내가 좋아하는 방송을 틀어놓고 하면 그래도 할만하다.

함수는 프로그래밍에서 가장 중요한 뼈대를 이룬다. 실제로 웹 브라우저에서는 함수를 사용해서 명령을 내리기 때문이다. 


 

 

 

여러 동작을 묶은 덩어리, 함수

자바스크립트 프로그램은 단순히 동작 하나만 실행되는 게 아니라 여러 가지 동작이 연결된다. 이렇게 동작해야 할 목적으로 묶은 명령을 함수라고 한다. 함수를 사용하면 각 명령의 시작과 끝을 명확하게 구별할 수 있고, 묶은 기능에 이름을 붙여서 어디서든 같은 이름으로 명령을 실행할 수 있다.

alert() 문도 자바스크립트에 포함되어 있는 여러 함수 중에 하나이다. alert() 함수의 괄호 안에 내용을 입력하면 웹 브라우저에서 알림 창을 표시할 수 있다.

 

 

함수는 왜 사용할까?

개발자는 프로그래밍을 할 때 alert() 함수처럼 자바스크립트에 들어 있는 함수를 가져다 사용하거나, 자신이 필요한 명령을 직접 함수로 만들어서 사용한다. 

함수를 만드는 방법은 다음과 같다. 예를 들어 다음과 같이 두 수를 더하는 프로그램이 있다면 숫자를 더하는 명령을 묶어 addNumber() 함수로 작성할 수 있다. 이렇게 함수로 만들면 a와 b 자리에 각각 10과 20을 넣어 더할 수 있다.

 

두 수를 더하는 함수 만들기


 

 

 

 

함수 선언 및 호출

함수를 사용하는 가장 기본적인 방법은 함수를 만들 때 이름을 붙이고 필요할 때마다 함수 이름을 사용해 실행하는 것이다. 함수가 어떤 명령을 처리할지 미리 알려주는 것함수를 선언한다 또는 함수를 정의한다고 한다. 함수를 선언할 때는 다음과 같이 예약어 function을 사용하고 중괄호 안에 실행할 여러 명령을 넣는다.

function 함수명() {
	명령
}

 

 

하지만 프로그램에서는 함수를 선언하는 것만으로는 함수가 실행되지 않는다. 함수를 선언한 후 따로 실행하는 코드를 작성해야 한다. 함수를 실행하려면 다음과 같이 미리 선언한 함수명을 써서 사용한다. 이렇게 선언한 함수를 사용하는 것함수를 호출한다 또는 함수를 실행한다고 한다.

함수명() 또는 함수명(변수)

 

 

두 수를 더하는 간단한 프로그램을 작성해 보자. 먼저 함수를 사용하지 않고 필요한 명령을 순서대로 나열하면 다음과 같이 작성할 수 있다. 웹 브라우저에서 실행하면 알림 창에서 바로 결과값(5)를 보여준다.

함수를 사용하지 않고 두 수 더하기

 


 

 

 

이렇게 한 번만 실행하고 끝나는 프로그램도 있지만, 두 수를 머하는 명령을 여러 번 실행해야 한다면 어떻게 해야 할까? 이럴 때 함수가 필요하다. 이번에는 함수를 사용하여 두 수를 더하는 프로그램을 만들어 보겠다.

다음 소스는 addNumber() 함수를 선언하고 다음 행에 함수를 2번 호출한다. 이렇게 사용하면 프로그램에서 addNumber() 함수가 필요한 곳에 함수를 여러 번 실행할 수 있다.

 

함수를 사용해 두 수 더하기

 

 

 

알림 창에서 결과값이 두 번 나타난다.

 

 


 

 

 

학습을 마치고

함수를 선언하고 호출하는 방법을 배울 수 있었다. 단원이 짧지만 내용이 여기서 끝나기에 마쳐본다. 함수는 선언의 순서가 관계없다는 것도 이 책에서 새롭게 알게 된 사실이다.