10장_자바스크립트 함수 다루기

10.1 함수란

어떠한 목적을 가지고 작성한 코드를 블록문 안에 모아둔 것

// 기본 형식
function gugudan() {
	for(let i = 1; i <= 9; i++){
		console.log(`3 * ${i} = ${3 * i}`);
	} // 3단을 출력하는 함수
}

10.2 함수를 정의하는 방법

• 함수 선언문으로 함수 정의하기
  function 키워드와 식별자를 통해 함수를 정의

// 기본 형식
function 식별자() {}

// 사용 시
함수명();

• 함수 표현식으로 함수 정의하기
  함수는 객체에서 파생된 자료형으로서 임의의 변수에 할당 가능
  식별자가 존재하면 ‘네이밍 함수’, 존재하지 않으면 '익명 함수’라 지칭

// 기본 형식
const 변수명 = function() {}; // 익명 함수
const 변수명 = function 식별자() {}; // 네이밍 함수

네이밍 함수를 사용하는 경우, 함수의 이름이 아닌 변수명으로 호출!

• 화살표 함수로 정의하기
  추가적인 함수 정의 방법

// 기본 형식
() => {};

10.3 함수 기능 확장하기

• 매개변수와 인수
  매개변수 : 함수를 정의할 때 외부 전달 데이터를 함수가 받을 수 있는 변수
  인수 : 정의한 함수를 호출 시 소괄호 안에 작성하는 전달하고 싶은 데이터

// 기본 형식

// 함수 선언문
function 함수명(매개변수1, 매개변수2, ...){}
// 함수 표현식
const 함수명 = function 식별자(매개변수1, 매개변수2, ...){};
// 화살표 함수
const 함수명 = (매개변수1, 매개변수2, ...) => {};
// 함수 호출
함수명(인수1, 인수2, ...);

• 매개변수의 특징

- 명명 규칙
 일반적으로 변수와 동일
- 데이터 전달
 함수를 정의할 때 함께 정의한 매개변수는 호출 시 전달되는 데이터와 일대일 대응
 '최소한'으로 정의, 호출 시 데이터가 전달되지 않아도 오류X(반대도 마찬가지) -> 사용불가
- 기본값 할당
 매개변수에 '=' 기호를 통해 직접 할당도 가능

• return 문
  함수 외부로 데이터를 반환할 시 사용

// 기본 형식
return 식(또는 값);

// 예시
function sum(num1, num2){
	let result = num1 + num2;
	return result; // 반환값
}
let result = sum(10, 20);

-> 반환값 없이 'return’만 작성한 경우 함수를 강제 종료하는 문구로 사용됨

10.4 함수의 특징 이해하기

• 스코프
  변수나 함수와 같은 참조 대상 식별자를 찾아내기 위한 규칙

- 스코프의 종류
 1. 함수 스코프
  함수에서 정의한 블록문만 스코프 범위로 인정(내부는 '지역', 외부는 '전역' 스코프)
 2. 블록 스코프
  '{}'로 구성된 블록문을 기준으로 스코프 범위 지정

let, const 키워드는 같은 스코프 영역에서 중복 선언 불가(다른 스코프 영역에선 가능)

// 예시
let a = 10; // 10
const b = 20; // 20
...{
	let a = 50; // 50
	const b = 30; // 30
}

• 함수 호이스팅
  코드를 선언과 할당으로 구분하여 선언부를 스코프 최상위로 끌어올리는(호이스팅) 것

// 함수 선언문으로 작성된 함수
(printHello();) // 호이스팅
function printHello() {
	console.log("Hello");
}
printHello();

// 함수 표현식으로 작성된 함수(화살표 함수 동일)
~~(printHello();)~~ // 호이스팅 불가
var printHello = function printHello() {
	console.log("Hello");
}
printHello();

10.5 즉시 실행 함수 사용하기

함수를 정의하는 동시에 실행하는 함수

// 기본 형식
(function () {}) ();

- 예시
 전역 스코프에 정의된 일반적인 함수는 메모리에서 제거X
 const 키워드에 할당할 경우 식별자 재사용 불가 -> '전역 스코프 오염' 현상 발생
 즉시 실행 함수를 통해 방지(한번 실행 후 메모리에서 제거)