✅ JavaScript에서의 함수 생성 방법
- 종류
✌️ 함수 선언문 (function statement)
✌️ 함수 표현식 (function expression)
✌️ 화살표 함수 (arrow function)
✌️ Function 생성자 (Function constructor)
✅ 함수 선언문
-
코드
function Add(a, b) { return a + b; } -
특징
✌️ 함수 선언문은 function 키워드로 시작하며, function 키워드 뒤에 함수명, 매개변수 리스트, 함수 몸체를 구현한다. 함수 선언문의 주요 특징은 실행 문맥의 맨 처음부터 시작한다는 것이다.
✌️ 다음 예제처럼 함수는 생성되기 전에 호출될 수 있습니다. 이러한 동작 방식을 함수 호이스팅(Function Hoisting)이라고 말한다.console.log(Add(5, 10)); // 15 function Add(a, b) { return a + b; } console.log(Add(10, 20)); // 30
✅ 함수 표현식
-
코드
const add = function Add(a, b) { return a + b; } const res = add(10, 30); console.log(res); // 40 -
특징
✌️ 함수 표현식은 생성된 함수를 변수에 할당한다. 함수가 할당된 변수를 함수 변수라고하며 함수 변수로 함수를 호출할 수 있다.
✌️ 함수 표현식은 다음 예제처럼 function 키워드 뒤에 함수명을 생략할 수 있으며, 이를 익명 함수 표현식이라고 말한다.const add = function (a, b) { return a + b; } const res = add(10, 30); console.log(res); // 40✌️ 함수 표현식은 함수 선언문과 다르게 실행 문맥의 맨 처음부터 시작하지 않는다. 함수 호이스팅이 발생하지 않는다.
✌️ 다음 예제처럼 함수 외부에서 함수를 직접 호출하는 경우 에러가 발생한다.let add = function Add(a, b) { return a + b; } console.log(Add(10, 20));
✅ 화살표 함수(함수 표현식의 변형)
-
코드
const add = (a, b) => a + b; const res = add(25, 25); console.log(res); // 50 -
특징
✌️ 화살표 함수는 함수 표현식을 더 간결하게 작성할 수 있으며, ECMA 2015에 도입되었다. 화살표 함수는 코드의 가독성을 증가시키는 더 짧은 구문을 제공하며, this 객체를 가지고 있지 않다.
✌️ 다음 예제는 화살표 함수에 대한 몇 가지 규칙을 소스코드로 보여준다.// 1. 매개변수는 소괄호에 작성합니다. const add = (a, b) => a + b; // 2. 매개변수가 하나인 경우 소괄호를 생략할 수 있습니다. const show = value => console.log(value); // 3. 매개변수가 없어도 소괄호는 존재해야 합니다. const show2 = value => console.log('Hello~'); // 4. 함수 본문에 표현식이 긴 경우 중괄호를 작성합니다. const divide = (a, b) => { if(b === 0) { return '0 으로 나눌 수 없습니다.'; } else { return a / b; } }
✅ Function 생성자
-
코드
const add = Function('a', 'b', 'return a+b'); const res = add(10, 20); console.log(res); // 30 -
특징
✌️ Function 생성자를 사용하여 함수를 생성할 수 있지만, 일반적으로 Function 생성자를 사용하는 경우는 굉장히 드물며 보안 및 성능 문제가 있어서 사용하지 않는 것이 좋다.
✌️ Function 생성자에서 매개변수와 함수 본문을 문자열로 전달하여 함수를 생성한다. Function 생성자로 생성된 함수는 항상 전역 범위에서 생성된다.
✌️ 생성자에 의해 정의된 객체는 호출이 됐을 때 pasrse 되는데 반해(동적), 객체 리터럴로 정의된 객체는 여타 다른 코드들이 parse 될 때 함께 pasrse 된다.
