[혼공스] Ch.05 함수

함수의 기본 형태

• 함수를 사용하면 좋은 점

1. 반복되는 코드를 한 번만 정의해놓고 필요할 때마다 호출하므로 반복 작업을 피할 수 있음
2. 긴 프로그램을 기능별로 나눠 여러 함수로 나누어 작성하면 모듈화로 전체 코드의 가독성이 좋아짐
3. 기능별(함수별)로 수정이 가능하므로 유지보수가 쉬움

• 익명 함수

function () {

}

• 선언적 함수

let 함수 = function () {

}

• 매개변수와 리턴값

매개변수 = 함수를 호출할 때 괄호 안에 적는 것

리턴값 = 함수의 최종 결과

function 함수(매개변수, 매개변수, 매개변수) {
  문장
  문장
  return 리턴값
}

• 나머지 매개변수

호출할 때 매개변수의 개수가 고정적이지 않은 함수를 가변 매개변수 함수라고 부릅니다.

자바스크립트에서 이러한 함수를 구현할 때는 나머지 매개변수라는 문법을 사용합니다.

function 함수 이름(...나머지 매개변수) {

}

• 나머지 매개변수와 일반 매개변수 조합하기

function 함수 이름(매개변수, 매개변수, ...나머지 매개변수) {

}

• 전개 연산자

함수이름 (...배열)

• 기본 매개변수

함수의 매개변수로 항상 비슷한 값을 입력하는 경우가 있습니다.

항상 같은 매개변수를 여러 번 반복해서 입력하는 것이 귀찮게 느껴질 수 있습니다.

이러한 경우에는 매개변수에 기본값을 지정하는 기본 매개변수를 사용합니다.

함수이름 (매개변수, 매개면수 = 기본값, 매개변수 = 기본값)

 

함수 고급

콜백 함수

자바스크립트는 함수도 하나의 자료형이므로 매개변수로 전달할 수 있습니다.

매개변수로 전달하는 함수를 콜백 함수라고 합니다

• forEach()

콜백 함수를 활용하는 가장 기본적인 함수입니다.

배열이 갖고 있는 함수(메소드)로써 단순하게 배열 내부의 요소를 사용해서 콜백 함수를 호출해줍니다.

function (value, index, array) {

}

• map()

콜백 함수에서 리턴한 값들을 기반으로 새로운 배열을 만드는 함수입니다.

numbers = numbers.map (function (value, indes, array) {
  return
}

• filter()

콜백 함수에서 리턴하는 값이 true인 것들만 모아서 새로운 배열을 만드는 함수입니다.

numbers = numbers.filter (function (value, indes, array) {

}

• 화살표 함수

map(), filter() 함수처럼 단순한 형태의 콜백 함수를 쉽게 입력하고자 화살표 함수를 사용합니다.

화살표 함수는 function 키워드 대신 화살표(=>)를 사용합니다.

(매개변수) => {

}

(매개변수) => 리턴값

• 타이머 함수

함수 이름	설명
setTimeout(함수, 시간)	특정 시간 후에 함수를 한 번 호출합니다.
setInterval(함수, 시간)	특정 시간마다 함수를 호출합니다.
clearTimeout(타이머_ID)	setTimeout() 함수로 설정한 타이머를 제거합니다.
clearInterval(타이머_ID)	setInterval() 함수로 설정한 타이머를 제거합니다.

타이머_ID는 setTimeout() 함수와 setInterval() 함수를 호출할 때 리턴값으로 나오는 숫자입니다.

• 함수 즉시 호출하기

//함수에 ()으로 감싸기
(function () {

}) ()

• 엄격 모드

<script>
  'use strict'
  문장
  문장
</script>

//일반적인 사용 패턴
<script>
  (function () {
    'use strict'
    문장
    문장
  }) ()
</script>