자바스크립트에서 가장 중요한 개념 1순위
함수는 특정기능을 제공하는 코드를 작성해서 함수를 정의하고 이 함수를 호출해서 결과값을 얻는다.
하지만 이러한 기능 외에도 함수는 모듈화, 클로저, 객체 생성 등 많은 기능을 제공한다.
자바스크립트에서는 함수도 값이다.
(= 함수형 프로그래밍이 가능한 이유)
따라서 객체 리터럴 방식으로 일반 객체를 생성할 수 있는 것처럼, 자바스크립트에서는 함수 리터럴을 이용해 함수를 생성할 수 있다.
함수 리터럴 : 함수 선언식, 표현식 방법 모두 이 방식
객체 리터럴 방식 : 객체를 생성하기 위한 표기법, {}안에 정의 후 변수에 객체값 할당하는 방식
function add(x,y){
//function 키워드로 시작
return x+y;
//함수가 호출되었을 때 실행되는 코드부분
}
function 키워드
리턴값과 매개변수로 넘기는 값의 변수타입을 기술하지않음
function add(x, y){
return x+y;
}
console.log(add(3,4)); //7
함수 끝에 ;
를 붙이지 않는다.
자바스크립트 (JavaScript)에서 함수는 값이다. 따라서 함수를 변수에 할당할 수 있다.
(익명)함수를 생성하고 생성한 함수를 변수에 할당한다.
const add = function(x, y){
return x + y;
};
함수 끝에 ;
를 붙인다.
함수를 할당한 변수는 함수를 참조할 뿐, 함수의 이름이 아니다.(함수변수)
const plus = add;
add === plus; // true
console.log( add(3,4) ); // 7
console.log( plus(5,6) ); // 11
함수변수 add
는 함수의 참조값을 갖고 있는 것이기 때문에 또 다른 변수 plus
에도 값을 그대로 할당할 수 있다.
호출하려면 함수변수를 호출하면 된다.
add와 plus는 같은 익명 함수를 참조하는 함수변수이다. 따라서 같은형태로 함수를 호출할 수 있다.
let add = function add(x, y){
return x+y;
}
Uncaught SyntaxError: Identifier 'add' has already been declared
함수변수에 기명함수를 참조하게 한 후 함수의 이름을 호출하면 error가 뜬다.
let fact = function factorial(n){
if(n<= 1){
return 1;
}
return n* factorial(n-1);
};
//기명함수 정의 후 변수에 할당 완료
console.log(fact(3)); // 6
console.log(factorial(3)); // referenceError
표현식으로 정의된 기명함수에서 함수의 이름은 외부코드에서 함수를 호출할 때가 아니라 정의된 함수 내부에서 해당 함수를 재귀적으로 호출하거나, 디버거 등에서 함수를 구분할 때 사용된다.
함수 외부에서 함수를 호출할 때는 함수 변수로 호출한다.
함수 내부에서 이뤄지는 재귀호출은 factorial 함수 이름으로 처리한다.
함수도 객체다.
함수는 기본기능인 코드실행 뿐아니라 일반객체처럼 프로퍼티를 가질 수 있다.
function add (x,y){
return x+y; //코드내부
}
// add 함수 객체에 result, status 프로퍼티 추가
add.result = add(3,2);
add.status = add('OK');
이렇게 하면 result는 어디에 저장될까?
코드내부에 프로퍼티를 생성하고 호출한 결과를 저장한다고 한다.
눈에 바로 보이지는 않지만 호출하면 값이 나오는 것을 확인할 수 있다.
console.log(add.result); // 5
console.log(add.status); // 'OK'
add함수는 함수 기능과 일반객체처럼 result, status 프로퍼티를 가지고 있다.
함수가 정상적으로 실행될 때 기대되는 인자의 개수를 나타낸다.
function func0(){}
function func1(x){
return x;
}
function func2(x, y){
return x+y;
}
function func3(x, y, z){
return x+y+z;
}
console.log('func0.length = ' + func0.length);
//func0.length = 0
console.log(func1.length); // 1
console.log(func2.length); // 2
console.log(func3.length); // 3