[JS] 함수

 

1. 함수

하나의 단위로 실행되는 문의 집합

 

1-1. 반환 값 (return)

함수 호출도 표현식

함수를 즉시 종료하고 값을 반환.

 

function getGreeting() {
	return 'Hello world';
}

getGreeting(); // Hello World

 

1-2. 호출과 참조

함수 식별자 뒤에 괄호를 쓰면 함수를 호출하려 한다고 이해하고 함수 바디를 실행함.

함수를 호출한 표현식은 반환 값이 됨.

 

get getGreeting() {
	return 'Hello world'
}

getGreeting(); // Hello world
getGreeting; // function getGreeting()

 

1-3. 함수와 매개변수

함수를 호출하면서 정보를 전달할 때는 함수 매개변수를 이용.

function sum(x, y) {
	return x + y;
}

sum(3, 5); // 8

 

1-4. this

this는 일반적으로 객체지향 프로그래밍 개념

객체의 프로퍼티인 함수에서 메서드를 호출하면 객체가 됨.

 

1-5. call, apply, bind

 

1) call

모든 함수에서 사용할 수 있으며 this를 특정 값으로 지정함.

함수를 호출하면서 call을 사용하고 this로 사용할 객체를 넘기면 해당 함수가 주어진 객체의 메서드인 것처럼 사용.

 

2) apply

함수 매개변수를 처리하는 방법을 제외하면 call과 같음.

call은 일반적인 함수와 같이 매개변수를 직접 받지만 apply는 매개변수를 배열로 받음.

const arr = [1, 10, -5, 3, 7];

Math.min.apply(null, arr); // -5
Math.max.apply(null, arr); // 10

Math.min - 최솟값

Math.max - 최댓값

this의 값에 null을 쓴 이유: Math.min과 Math.max가 this와 관계없이 동작하기 때문에

 

ES6의 확산 연산자(...)를 사용해도 apply와 같은 결과를 얻음.

update 메서드는 this 값이 중요하므로 call을 사용해야 하지만, Math.min과 Math.max는 this 값이 무엇이든 관계없으므로 확산 연산자를 그대로 사용.

 

3) bind

this의 값을 바꿀 수 있는 함수