함수
함수란 한 마디로 프로그램의 코드를 저장한 공간이라고 할 수 있다.
함수를 사용하면 코드를 메모리에 저장했다가 필요할 때마다 호출하여 사용할 수 있다.
변수와 함수의 차이
변수 | 함수 |
---|---|
- 1개의 데이터만 저장한다. - var라는 키워드를 이용하여 선언한다. - 문자형, 숫자형, 논리형 데이터를 보관한다. - 객체를 참조한다. |
- 자바스크립트 코드를 저장한다. - funciton이라는 키워드를 이용하여 선언한다. - 출력문, 제어문 등의 코드를 저장하고 데이터를 반환한다. |
선언적 함수
가장 기본적으로 사용하는 함수의 형태이다. 기본적으로 함수는 함수 이름을 설정하고 함수 이름을 호출해야 실행이 된다.
기본형
function(){ 자바스크립트 코드; }함수명;
예시
<script> function myFnc(){ document.write("hello"); }myFnc(); <//script>
결과보기
익명함수
익명 함수는 함수에 이름이 없기 때문에 변수에 넣어서 사용하는 함수이다. 변수에는 숫자, 문자도 들어갈 수 있지만 함수도 들어갈 수 있다.
기본형
함수명; function(){ 자바스크립트 코드; }
예시
<script> myFnc(); function myFnc(){ document.write("hello"); <//script>
결과보기
매개변수 함수
기본 함수 정의문은 함수 안에 있는 코드를 실행할 때 단순히 함수명으로 호출해서 코드를 실행했다. 즉 함수를 호출할 때 값을 전달할 수 없었다. 하지만 매개변수가 있는 함수 정의문은 함수를 호출할 때 전달하고자 하는 값을 입력하여 호출할 수 있습니다. 이렇게 전달된 값은 매개변수가 받아 함수 정의문에서 사용할 수 있게 된다.
기본형
function 함수명(매개변수1, 매개변수2,...매개변수n){ 자바스크립트 코드; } 함수명(데이터1, 데이터2,...데이터n);
예시
<script> function myFnc(name, area){ document.write("안녕하세요." + name + "입니다.","<br>"); document.write("사는 곳은" + area + "입니다.","<br><br>"); } myFnc("홍당무","서울"); myFnc("깍두기","부산"); <//script>
결과보기
사는 곳은 서울입니다.
안녕하세요. 깍두기입니다
사는 곳은 부산입니다.
리턴값 함수
return 문은 함수에서 결괏값을 반환할 때 사용합니다. 그리고 함수에서 return 문이 실행되면 반복문의 break 문과 비슷하게 코드가 강제로 종료된다. 다시 말해 함수 정의문에 return 문이 실행되면 함수를 호출했을 때 결괏값(data)을 반환한다.
기본형
function 함수명(){ 자바스크립트 코드1; return 데이터(값); 자바스크립트 코드2; } var 변수 = 함수명();
예시
<script> functoin testAvg(arrData){ var sum = 0; for (var i = 0; i < arr data.length; i++){ sum += Number(prompt(arrData[i] + "점수는?", "0")); } var arrSubject = {"국어", "수학"}; var result = testAvg(arrSubject); document.write("평균점수는" + result + "점입니다"); >script>