melius
[JS] 함수 본문
1. 함수(Function)
1) 매개변수(Parameter)
함수선언(Function Statement)시에 사용되는 변수로 함수의 입력을 받는 변수
2) 인수(Argument)
함수호출(Function Call)시에 함수의 매개변수로 전달되는 입력값
function add(x, y) { // parameters: x, y
return x + y;
}
console.log(add(1, 2)); // arguments: 1, 2
* 함수는 1급 객체(first class object)이다.
- 변수에 할당할 수 있다.
- 함수의 인자로 사용할 수 있다.
- 함수의 리턴값으로 사용할 수 있다.
2. 정의방식
https://developer.mozilla.org/en-US/docs/Web/JavaScript/Guide/Functions
1) 함수 선언문(Declaration, Statement)
console.log(sum(1, 2));
function sum(num1, num2) { // parsetime
return num1 + num2;
}
* 함수 선언문으로 정의된 함수는 호이스팅(Hoisting)됨
2) 함수 표현식(Expression)
var add = function sum(num1, num2) { // runtime
return num1 + num2;
}; // 표현식은 ';' 사용권장
var zero = function () {
return 0;
};
console.log(add(zero(), 1));
console.log(sum(zero(), 1)); // ReferenceError, 외부코드에서 접근 불가
// 재귀함수호출(Recursive Function Call)에는 사용가능
* 익명함수(anonymous function, 이름없는 함수)는 표현식 형태로 사용가능
* 익명함수는 constructor 속성값이 다르다.
3) 화살표 함수 표현식(Arrow Function Expression, ES6)
var fn1 = (prm1, prm2) => { console.log(prm1); return prm2; };
// one parameter
var fn2 = prm1 => { console.log(prm1); return prm1; };
// one expression
var fn3 = prm1 => prm1; // do not use {} (wrong { prm1; })
* 화살표 함수는 표현식 형태로 사용가능
4) Function 생성자 함수를 이용한 함수정의
내장객체 Function 생성자 함수를 이용하여 아래와 같이 함수를 정의할 수 있다.
var add = new Function('x', 'y', 'return x + y');
console.log(add(1, 2));
3. 주요특성
1) 내부함수(Inner or Nested Function)
함수 내부에 정의된 함수
자신을 정의한 외부함수(Outer or Containing Function) 내부에서만 호출가능
외부함수 내에서 호이스팅 발생
outFun(2, 3); // hoisting
function outFun(x, y) {
console.log(innerFun()); // hoisting
function innerFun() {
return x * y;
}
}
// innerFun(); // ReferenceError
2) 즉시 실행 함수 표현(IIFE, Immediately Invoked Function Expression)
함수를 정의하고 바로 호출함
var val = function () { return "IIFE"; }();
console.log(val);
표현식(Expression)이므로 반환값이 있다.
3) arguments 객체
함수 내부에서 접근가능한 객체로서, 함수에 전달된 인수의 값을 가지고 있는 유사배열(Array-like) 객체
* 유사배열(Array-like) 객체는 length 프로퍼티는 있으나, 배열 객체가 아님
function fun(x) {
console.log(x);
console.log(arguments.length);
console.log(arguments[0]);
console.log(arguments[1]);
}
fun(1); // 1, 1, 1, undefined
fun(1, 2, 3); // 1, 3, 1, 2
4) 함수호출
함수호출(Function Call)은 표현식이므로, 반환값이 있다.
함수에 리턴문이 없으면 undefined를 반환한다.
* 표현식(expression)은 문장(statement)에 속한다.
'JavaScript' 카테고리의 다른 글
[JS] 프로토타입 (0) | 2020.01.01 |
---|---|
[JS] this (0) | 2020.01.01 |
[JS] 객체 (0) | 2019.12.30 |
[JS] 연산자 (0) | 2019.12.25 |
[JS] 변수와 자료형 (0) | 2019.12.24 |