함수는 영어로 function으로 프로그래밍에서의 함수는 수학에서의 함수와 같은 개념이지만 수학이 필요한 것은 아니다.
그렇지만 프로그래밍에서 함수의 가장 중요한 역할을 꼽자면 하나의 로직을 재실행할 수 있도록 하는 것으로 코드의 재사용성을 높여준다는 것이다. 재사용성이라는 것은 작성한 코드를 여러 맥락에서 다시 사용할 수 있도록 하는 것이다.
함수의 형식
함수는 function이라는 키워드로 시작한다.
function 다음에는 함수의 이름을 지정해주고 그 뒤에는 소괄호()가 나온
다. 소괄호 뒤에는 중괄호{}가 오고 그 안에는 실제 사용할 코드를 작성한다.
function 함수명 ([인자...[,인자]]) {
코드
return 반환값
}function numbering() { // numbering이라는 함수
document.write(1); // 함수 numbering 실행 코드
}
numbering(); // 함수 호출해당 함수를 호출할 때는 함수명 뒤에 괄호 없이 쓴다면 자바스크립트가 변수로 인식하기 때문에 함수명 뒤에 소괄호를 꼭 써줘야 한다.
함수에서 가장 중요한 것은 재사용성이라는 것을 다시 한번 강조한다. 함수 안의 코드를 변경하면 그 함수를 사용하는 모든 곳에서 그 변경이 반영되기 때문에 함수의 재사용성이 높을 때 우리가 얻을 수 있는 혜택이다.
함수의 효용(함수가 없다면)
0부터 9까지 출력하는 코드를 5번 출력한다면
var i = 0;
while(i < 10){
document.write(i);
i += 1;
}
var i = 0;
while(i < 10){
document.write(i);
i += 1;
}
var i = 0;
while(i < 10){
document.write(i);
i += 1;
}
var i = 0;
while(i < 10){
document.write(i);
i += 1;
}
var i = 0;
while(i < 10){
document.write(i);
i += 1;
}이렇게 코드가 길어진다.
거기에 0부터 9까지 출력을 0부터 19까지로 변경한다면 5번 작성한 코드의 조건을 하나하나 변경해야한다.
이런 경우에 함수를 사용한다면 아래처럼 코드 길이가 줄어들 것이다.
function numbering(){
var i = 0;
while(i < 10){
document.write(i);
i += 1;
}
}
numbering();
numbering();
numbering();
numbering();
numbering();
// numbering() 호출시 결과 값
// 0123456789
하지만 함수로 호출한다고 해도 이를 1000번 이상 호출해야한다면 함수를 1000번 사용하여 호출하기도 힘들 것이다.
이럴 때 반복문 for문으로 1000번 호출하도록 하면 된다.
function numbering(){
var i = 0;
while(i < 10){
document.write(i);
i += 1;
}
}
for(i = 0; i < 1000; i++) {
numbering();
}
// 굳이 함수를 사용하지 않아도 1000번 반복할 수 있다
for(var i = 0; i < 1000; i++) {
var i = 0;
while(i < 10){
document.write(i);
i += 1;
}
}
또한 함수는 여기저기에서 사용이 가능하기에 재사용성이 높다. 재사용성이 높아진다면 여러 곳에서 사용되고 있는 함수의 내용이 변경 또는 개선 등이 되었을 때 함수를 사용하고 있는 여러곳에서 한번에 반영되어 어떠한 문제 또한 한번에 해결할 수 있다. 그렇기에 유지보수에도 용이하다고 볼 수 있다. 그리고 코드를 읽기가 쉬워져 가독성도 좋아져 복잡한 로직을 실행하기에도 수월해질 것이다.
입력과 출력
수학에서 함수라고 하면 가장 중요한 요소라는 것이은 입/출력이다. 당연히 프로그래밍에도 입/출력이 가장 중요하다.
따라서 수학의 함수와 프로그램밍의 함수는 같은 개념이므로 입력에 따라 출력이 달라진다.
출력은 return이라는 키워드를 사용하며 return은 두 가지를 한다.
1. 이 함수를 종료시켜라
2. return 뒤에 있는 값을 해당 함수의 출력 값으로 반환시켜라
function get_member1(){
return 'egoing';
}
function get_member2(){
return 'k8805';
}
alert(get_member1()); // egoing 출력
alert(get_member2()); // k8805 출력
그렇다면 한 함수 안에 return을 여러 번 사용한다면 어떻게 될까?
function get_member1(){
return 'egoing';
return 'k8805';
}
alert(get_member1()); // egoing 출력하고 끝남
첫번째 return만 실행되고 나머지는 출력하지 않는다. 그것은 첫번째 return을 실행한 후에 함수가 종료되었기 때문이다. 이것이 함수의 출력이다.
입력은 함수로 유입되는 입력 값(인자)에 따라 함수가 반환하는 값이나 메소드의 동작방법을 다르게 할 수 있다.
function get_argument(arg){ // arg가 입력과 관련 / arg = 매개변수(parameter)
return arg; // return이 출력과 관련
}
alert(get_argument(1)); // 1 출력 / ()안의 값 = 인자(argument)
alert(get_argument(2)); // 2 출력값 자체는 인자라고 하고 그 값을 받는 변수는 매개변수 또는 파라미터라고 한다. 개념적으로 이 부분이 입력이 된다.
여러개의 입력 값을 받을 수 있지만 return 값은 한개만 가능하다.
function get_arguments(arg1, arg2){
return arg1 + arg2
}
alert(get_arguments(10, 20)); // 10 + 20 = 30
alert(get_arguments(20, 30)); // 20 + 30 = 50
함수를 정의하는 방법에는 여러가지가 있다.
// 함수에 대한 정의 부분이 좌항에 있는 변수에 대입될 수 있다.
// 함수표현식
var numbering = function (){
i = 0;
while(i < 10){
document.write(i);
i += 1;
}
}
numbering();
// 위 코드는 아래 코드와 같은 개념이다
// 기명함수
function numbering(){
i = 0;
while(i < 10){
document.write(i);
i += 1;
}
}
// 이 함수는 정의된 함수를 바로 호출한다
// 익명함수
(function (){
i = 0;
while(i < 10){
document.write(i);
i += 1;
}
})();
출처: 생활코딩
