12.1 함수란?
프로그래밍의 함수는 일련의 과정을 문으로(statement)구현하고, 코드로 블록을 감싸서, 하나의 실행단위로 정의한 것이다.
function add(x,y) {
return x + y;
}
const result = add(2,4);함수에서 사용되는 용어는 argument, parameter, return value있다. parameter는 매개변수라는 의미로써, 위에서 x,y 와 같이 함수 내부로 입력받은 입력 변수를 의미하며, 해당 입력값을 인수(argument) 그리고 출력을 return value이다.
2. 함수를 사용해야 하는 이유
함수는 필요할때, 여러번 호출할 수 있다. 즉, 재사용이 가능하기 때문에 같은 코드를 중복해서 사용하는 것보다 함수를 정의해서 재사용하는것이 효율적이다. 즉, 위 장점으로 인해 함수는 유지보수의 편의성을 높이고, 실수를 줄여 코드의 신뢰성을 높일 수 있다.
3. 함수 리터럴
자바스크립트 함수는 객체 타입의 값이다. 따라서, 함수또한 리터럴로 생성 가능하다.
let f = function add(x,y){
return x + y;
}4. 함수 정의
함수를 정의하는 방법에는 4가지 정도가 있다.
// 함수 선언문
function add(x,y){
return x + y;
}
// 함수 표현식
let add = function (x,y){
return x + y;
}
// Function 생성자 함수
let add = new Function('x','y', 'return x + y');
// 화살표 함수
let add = (x,y) = > x + y;
함수를 생성하는 내부동작에 차이는 존재한다. 다음 예제를 살펴보자
function foo(){
console.log('foo');
}
foo(); //foo
(
function bar(){
console.log('bar');
}
)
foo() // ReferenceError : bar is not defined!
위예제에서는 함수 선언문으로 생성된 foo는 호출할 수 있으나, 함수리터럴 표현식으로 생성된 bar는 호출 할 수 없다.
4.2 함수 표현식
함수 선언문으로 정의한 함수와 함수 표현식으로 정의한 함수의 생성 시점은 다르다.
모든 선언문이 그럿듯 함수 선언문도 런타임 이전에 자바스크립트 엔진에 의해 먼저 실행된다. 즉 ,런타임 이전에 객체가 먼저 생성 되고 자바스크립트 엔진은 함수이름과 동일한 이름의 식별자를 생성하고 생성된 함수 객체의 할당하게 된다.
** 호이스팅
함수 선언문이 코드의 선두로 끌어 올려진 것 처럼 동작하는 자바스크립트의 고유 특징을 함수 호이스팅 이라 한다.
그러나, 함수 호이스팅과 변수 호이스팅은 미묘한 차이가 존재한다. var 키워드를 사용하면, 자바스크립트 엔진이 런타임 이전에 객체를 생성하는것은 동일하지만, var로 선언된 변수는 undefined로 초기화되고, 함수선언문을 통해 생성된 함수 객체는 함수 호이스팅에 의해 호출이 가능하다.
따라서, 함수 표현식으로 함수를 정의하면,함수 호이스팅이 발생하는 것이 아니라 변수 호이스팅이 발생한다. 즉, 함수 표현식 이전에 함수를 참조하면, undefined로 평가된다. 함수 호이스팅은 함수로 호출하기 전에 반드시 함수를 선언해야 한다는 당연한 규칙을 무시한다. 그렇기 때문에 함수 선언문 대신에 함수 표현식을 사용할 것을 권장한다.
6. 참조에 의한 전달과 외부 상태의 변경
