12.1 함수란?

함수는 자바스크립트에서 가장 중요한 핵심 개념이다. 자바스크립트를 정확히 이해하고 사용하기 위해 핵심중의 핵심이다.

함수 내부로 입력을 전달받는 변수를 매개변수, 입력을 인수, 출력을 반환값이라 한다. 또한 함수는 값이며, 여러 개 존재할 수 있으므로 특정 함수를 구별하기 위해 식별자인 함수 이름을 사용할 수 있다.

image.png

함수는 함수 정의를 통해 생성한다. 다음은 함수 선언문을 통해 함수를 정의한 예다.

// 함수 정의
function add(x,y){
	return x + y;
}

이렇게 정의한 함수는 함수 호출에 의해 실행된다.

// 함수 호출
var result = add(2,5); // 7

12.3 함수 리터럴

자바스크립트의 함수는 객체 타입의 이다. 따라서 숫자 값을 숫자 리터럴로 생성하고 객체를 객체 리터럴로 생성하는 것처럼 함수도 함수 리터럴로 생성할 수 있다. 함수 리터럴은 function 키워드, 함수 이름, 매개변수, 함수 몸체로 구성된다.

// 변수에 함수 리터럴을 할당
var f = function add(x,y){
	return x+y;
}

image.png

리터럴은 값을 생성하기 위한 표기법이다. 따라서 함수 리터럴도 평가되어 값을 생성한다. 이 값은 객체다. 즉, 함수는 객체다.

함수는 객체지만 일반 객체와는 다르게 함수는 호출할 수 있다. 또한 함수 객체만의 고유한 프로퍼티를 갖는다.

함수가 객체라는 사실은 다른 프로그래밍 언어와 구별되는 자바스크립트의 중요한 특징이다.


12.4 함수 정의

함수를 정의하는 방법에는 4가지가 있다.

  1. 함수 선언문

    function add(){
    	return x + y;
    }
    
  2. 함수 표현식

    var add = function(x,y){
    	return x + y;
    }
    
  3. Function 생성자 함수

    var add = new Function('x','y','return x + y');
    
  4. 화살표 함수 (ES6)

    var add= (x,y) => x + y
    

모든 함수 정의 방식은 함수를 정의한다는 면에서 동일하다. 단, 미묘하지만 중요한 차이가 있다.

12.4.1 함수 선언문

// 함수 선언문
function add(x,y){
	return x + y;
}