5. Javascript 함수

함수(function)란?

<script>
  function nightdayhandler(self) {
 	<input id='night_day' type='button' value='night' onclick='nightdayhandler(this);'>
  }
</script>

nightdayhandler라는 함수를 통해 모든 input 태그를 핸들링 할 수 있다.

 

함수 사용의 장점

1. 코드의 유지보수가 쉬워진다. 하나의 함수를 여러군데에서 사용할 때, 이를 하나하나 바꿔줄 필요 없이 함수를 만들어 준 곳에서만 바꿔주면 된다. 즉, 효율성과 실수를 줄여준다.

2. 코드의 길이가 짧아진다. 같은 코드가 계속해서 반복되는 것을, 딱 한 번만 써줌으로 인해서 웹페이지의 크기를 줄여줄 수 있고, 이로 인해 전송 속도가 빨라진다. 즉, 성능이 좋아진다.

3. 함수를 사용하면 두 코드가 논리적으로 같다는 것을 한 번에 알 수 있고, 적절한 이름을 붙여주면 이 코드가 어떤 일을 하는지 한 눈에 알 수 있다. 즉, 다른 사람이 내가 작성한 코드를 보기 용이해지고 관리가 쉬워진다.

 

매개변수(Parameter), 인자(Argument) 그리고 Return

함수는 입력과 출력으로 이루어져 있으며, 입력에 해당하는 것이 매개변수(Parameter)와 인자(Argument)이고, 출력에 해당하는 것이 Return 이다.

// 위 sum 함수에서 2, 3이라는 인자를 left, right 라는 매개변수에 각각 넣어주면 5라는 값이 리턴된다.
function sum(left, right) {
  document.write(left + right);
}

sum(2,3);

// 위와 동일한 결과값을 확인할 수 있다.
function sum(left, right) {
  return left + right
}

sum(2,3);