함수란 ?

함수는 자바스크립트에서 가장 중요한 핵심이다.

수학의 함수는 입력을 받아 출력을 내보내는 일련의 과정을 정리한 것이다.

프로그래밍 언어의 함수는 일련의 과정을 문으로 구현하고 코드 블록으로 감싸서
하나의 실행 단위로 정의한 것이다.

프로그래밍 언어의 함수도 입력을 받아서 출력을 내보낸다.

이때 함수 내부로 입력을 전달받는 변수를 매개변수(parameter)

입력을 인수argument , 출력을 return value 라 한다.

또한 함수는 값이며, 여러 개 존재할 수 있으므로 특정 함수를 구별하기 위해

식별자인 함수 이름을 사용할 수 있다.

funcion add(x,y) {
return x + y;
}
add(2, 5);
각 함수의 구성요소를 살펴보자

add (함수이름)
(x , y) (매개변수)
x + y; (반환값) // 여기까지 함수의 정의 부분이다
add(2, 5); (인수) // 이부분은 함수 호출 부분이다.

위 예제에도 나와있지만 함수의 정의만으로 함수가 실행되지는 않는다.

인수를 매개변수를 통해 함수에 전달하면서 함수의 실행을 명시적으로 지시해야 한다.

이를 함수 호출이라 한다.

함수를 사용하는 이유

한 눈에 보기도 어려운 구조인 함수르 우리가 사용해야 하는 이유는 무엇일까

그것은 코드의 재사용이다.

함수는 필요할 때 여러 번 호출할 수 있다.

동일한 작업을 반복적으로 수행해야 한다면 같은 코드를 중복해서

여러 번 작성하는 것이 아니라 정의된 함수를 재사용한ㄴ 것이 효율적이다.

let x = 0;
let y = 0;
let result = 0;
x = 1;
y = 2;
result = x + y; // 3

function add(x,y){
return x + y;
}
let result = 0;
result = add(1,2); // 3

함수를 사용한 예와 사용하지 않은 예를 보자.

하나의 예제를 들어서 언뜻 차이를 못 느낄 수 있지만 유지보수를 해야하는

개발자 입장에서 생각해본다면 극과 극의 차이일 것이다.

코드의 중복을 줄이고 재사용성을 최대로 해 실수를 줄여 코드의 신뢰성을 높이는

효과도 있다.

또한 add와 같이 적절한 이름(식별자)를 붙여 역할에 맞는 이름을 사용해야 한다.
적절한 함수명은 코드의 가독성을 향상시킨다.

함수 리터럴

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

함수 리터럴의 구성 요소는 다음과 같다.

• 변수 이름
  함수 이름은 식별자다. 식별자 네이밍 규칙을 준수해야 한다.
  함수 이름은 생략할 수 있다.
  이름이 있는 함수를 기명 함수
  이름 없는 함수를 무명/익명 함수라 한다.

• 매개변수 목록
  0개 이상의 매개변수를 소괄호로 감싸고 쉼표로 구분한다.
  각 매개변수에는 함수를 호출할 때 지정한 인수가 순서대로 할당된다.
  즉 매개변수 목록은 순서에 의미가 있다.

• 함수 몸체
  함수가 호출되었을 때 일괄적으로 실행될 문들을
  하나의 실행 단위로 정의한 코드 블록이다.
  함수 몸체는 함수 호출에 의해 실행된다.

함수 정의

함수 선언문

function add(x,y) {
return x + y
}
함수 참조
console.dir(add); // f add(x,y)
console.dir은 console.log와는 달리 함수 객체의 프로퍼티까지 출력한다.
console.log(add(2,5)); // 7

함수 선언문은 함수 리터럴과 형태가 동일하다.
단, 함수 리터럴은 함수 이름을 생략할 수 있으나,
함수 선언문은 함수 이름을 생략할 수 없다.

function (x,y) {
return x + y;
}
// StntaxError : Function statements require a function name

함수 선언문은 표현식이 아닌 문이다.

콘솔에서 함수 선언문을 실행하면 완료 값 undefined가 출력된다.

만약 표현식인 문이라면 완료 값 undefined 대신 표현식이 평가되어

생성된 함수가 출력되어야 한다

function add(x , y) {
return x + y;
}
undefiend

함수 표현식

자바스크립트의 함수는 객체 타입의 값이다.

값처럼 변수에 할당할 수도 있고 프로퍼티 값이 될 수도 있으며 배열의 요소가 될 수도 있다.

이처럼 값의 성질을 갖는 객체를 일급 객체라 한다.

자바스크립트의 함수는 일급 객체다.
함수가 일급 객체라는 것은 함수를 값처럼 자유롭게 사용할 수 있다는 의미다.

함수는 일급 객체이므로 함수 리터럴로 생성한 함수 객체를 변수에 할당할 수 있다.
이러한 함수 정의 방식을 함수 표현식이라 한다.

let add = function (x,y) {
return x + y;
};
console.log(add(2,5)); // 7

화살표 함수

ES6에서 도입된 화살표 함수(arrow function)는 키대신 화살표=>를 사용해

좀 더 간략한 방법으로 함수를 선언하는 방식이다.

화살표 함수는 항상 익명 함수로 정의한다.

const add = (x,y) => x + y;
console.log(add(2,5)); // 7

추가적으로 화살표 함수의 유일한 문장이 'return' 일때

return과 {}(중괄호) 를 생략할 수 있다.