Chapter 05

5장

---

🌴05-1 함수의 기본 형태

• 함수호출 : 함수를 사용하는 것, '함수를 호출하다'라고도 표현
• 매개변수 : 함수를 호출할 때는 괄호 내부에 여러 가지 자료를 넣는데, 이러한 자료를 매개변수라고 부름
  매개변수를 통해 함수는 외부의 정보를 입력 받을 수 있음
• 리턴값 : 함수의 최종적인 결과를 리턴값이라 함. 함수 내부에 return 키워드를 입력하고 뒤에 값을 넣어서 생성함

- 함수 : 코드의 집합을 나타내는 자료형

→함수를 코드의 집합이라고 말하는 이유 : 중괄호{...} 내부에 코드를 넣기 때문

→함수의 자료형은 function이며 현재 코드에서 함수를 출력하면 f( ) { } 라고 출력됨. 이때 f는 함수를 나타냄

→함수의 장점

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

 

 

- 익명 함수

: 이름이 없는 함수

function() { }

 

- 선언적 함수

: 이름이 있는 함수

function 함수() {

}

let 함수 = function() { };

 

- 매개변수와 리턴값

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

 

-나머지 매개변수 

: 호출 할 때 매개변수의 개수가 고정적이지 않은 함수를 가변 매개변수 함수라고 부름

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

자바스크립트에서 이러한 함수를 구현 할 때는 나머지 매개변수라는 특이한 형태의 문법을 사용

함수의 매개변수 앞에 마침표 3개(...)를 입력하면 매개변수들이 배열로 돌아옴

 

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

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

 

- 가변 매개변수 함수

매개변수의 개수가 고정되어 있지 않은 함수를 의미

 

-전개 연산자

배열의 함수로써 전개하고 싶을 때 사용

함수 이름(...배열)

배열을 전개해서 함서의 매개변수로 전달해주는 전개연산자

 

- 기본 매개변수

매개변수에 기본값이 들어가게 하고 싶을 때 사용하는 매개변수

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

 

 

🌴05-2 함수고급

 

- 콜백 함수

: 매개변수로 전달하는 함수를 의미

1. 콜백 함수를 활용하는 함수 : forEach()

function (value, index, array) { }

2. 콜백함수를 활용하는 함수 : map()

3. 콜백함수를 활용하는 함수 : filter()

 

- 화살표 함수 

: 익명함수를 간단하게 사용하기 위한 목적으로 만들어진 함수 생성 문법임

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

(매개변수) => {

}

(매개변수) => 리턴값

 

-타이머 함수

: 특정 시간마다 또는 특정 시간 이후에 콜백 함수를 호출할 수 있는 타이머 함수들이 있음

함수이름	설명
setTimeout(함수, 시간)	특정 시간 후에 함수를 한 번 호출함
setInterval(함수, 시간)	특정 시간마다 함수를 호출함

함수이름	설명
clearTimeout(타이머_ID)	setTimeout() 함수로 설정한 타이머를 제거
clearInterval(타이머_ID)	setInterval() 함수로 설정한 타이머를 제거

 

 

+좀더 알아보기

 

- 비동기 프로그래밍

: 요청과 결과가 동시에 일어나지 않는 것을 의미

코드가 작성된 순서대로 실행디는 것이 아니라 행위를 요청한 뒤, 그 결과를 기다리지 않고 다른 코드를 실행하여 다른 코드를 실행하여 실행 흐름을 방해하지 않고 그대로 흐름을 이어가는 것을 말함

 

- 스코프

: 변수에 접근할 수 있는 범위, 중괄호나 함수를 사용해서 블록을 만들어준다

• 전역 스코프 : 어느 곳에서도 해당 변수에 접근 할 수 있음
• 지역 스코프 : 범위를 벗어난 곳에서는 해당 변수에 접근할 수 없음

- 섀도잉

: 함수 외부에서 선언한 변수를 함수 내부에서도 같은 이름으로 변수를 선언하여 사용할 때, 함수 내부의 변수가 함수 외부의 변수를 가리는 현상.

 

1. 즉시 호출 함수

: 변수의 이름 충돌을 막기 위해서 코드를 안전하게 사용하는 방법

(function () {}) ()

 

2. 엄격모드

자바스크립트의 문법오류를 더 발생시키는 엄격모드는 실수를 줄일 수 있는 방법임.

'use strict'라는 문자열을 블록 가장 위쪽에 배치해서 사용할 수 있음

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

 

3. 익명함수와 선언적 함수의 차이

while 반복문은 조건을 중심으로 반복할 때,

for 반복문은 횟수를 중심으로 또는 배열 등을 중심으로 반복할 때 사용

 

익명함수와 선언적 함수는 사용하는 상황이 비슷

익명함수 VS 선언적 함수

1. 익명함수의 사용 
   : 익명함수는 순차적인 코드 실행에서 코드가 해당 줄을 읽을 때 생성됨
2. 선언적 함수의 사용
   : 선언적 함수는 순차적인 코드 실행이 일어나기 전에 생성됨
   따라서 선언적 함수는 같은 블록이라면 어디에서 함수를 호출해도 상관없음
   
3. 선언적 함수와 익명함수의 조합
   : 선언적 함수는 먼저 생성되고, 이후에 순차적인 코드 진행을 시작하면서 익명 함수를 생성함
4. 블록이 다른 경우에 선언적 함수의 사용
   : 선언적 함수는 어떤 코드 블록(script 태그 또는 함수 등으로 구분되는 공간)을 읽어들일 때 먼저 생성됨

결론 : 자바스크립트는 블록이 예상하지 못하게 나뉘는 문제 등이 발생할 수 있어 안전을 위해 익명 함수를 더 많이 사용하는 편