이론/JS
[JS] 함수 선언문 / 함수 표현식
millfeel1298
2021. 1. 2. 20:00
- 함수는 값으로 취급된다.
- 함수의 자료형은 호출이 가능한 객체이다.
- 함수는 객체처럼 함수에 프로퍼티를 추가·제거하거나 참조를 통해 전달할 수도 있다.
함수 선언문
function name(parameters){
code block
}- function: 키워드
- name: 함수 이름
- parameters: 매개변수(매개변수가 여러 개 있다면, 콤마로 구분)
* parameter와 argument의 차이
함수 표현식
익명 함수 표현식
let funcName = function(){ ... };함수를 만들고, 그 함수를 변수에 할당한다.
기명 함수 표현식
let funcName = function func(){ ... };function 뒤에 이름을 붙인다.
Q. 기명 함수 표현식과 익명 함수 표현식의 차이는?
- 기명 함수 표현식은 함수에 이름을 사용해서 함수 표현식 내부의 자기 자신을 참조할 수 있다.
- 기명 함수 표현식의 함수의 이름은 외부에서 사용할 수 없다.
// 기명 함수 표현식
let namedFun = function fun(who){
if(who){
console.log(who + '님, 환영합니다.');
} else {
fun('손'); // ----------------------------- 기명 함수 사용
}
};
// 익명 함수 표현식
let anonymousFun = function(who){
if(who){
console.log(who + '님, 환영합니다.');
} else {
anonymousFun('손'); // --------------------- 자신의 함수 사용
}
};
// 새로운 변수에 할당
let copy_namedFun = namedFun;
let copy_anonymousFun = anonymousFun;
// 기본의 변수에 null 할당
namedFun = null;
anonymousFun = null;
함수 선언문과 함수 표현식의 세미콜론 유무
함수 선언문에는 세미콜론이 없지만, 함수 표현식에는 세미콜론이 붙어있다.
function name(){ ... }
let name = function(){ ... };if문, for문, 함수 선언문과 같이 중괄호로 만든 코드 블록(statement) 끝에는 세미콜론이 없어도 된다.
하지만 함수 표현식은 값(value)의 역할을 하기 때문에 세미콜론을 붙이는게 좋다.
함수를 호출하는 방법
name();함수 이름 오른쪽에 "실행 연산자"를 사용해서 호출할 수 있다.
[실행 연산자를 사용하지 않았을 경우]
name함수 소스 코드가 문자형으로 바뀌어 출력된다.
함수를 복사하는 방법
let user;
user = age //함수의 소스 코드가 복사되면서 user()을 사용할 수 있게 된다.
user = age() //함수의 값이 복사된다.함수의 값을 반환(return)하는 방법
function name(){
return 'mill';
}- "지시자 return"을 사용한다.
- return은 함수 내 어디서든 사용할 수 있다.
- 실행 흐름이 return을 만나면 함수 실행은 즉시 중단되고, 함수를 호출한 곳에 값을 반환한다.
- return문이 없거나, return 지시자만 있으면 undefined를 반환한다.
[주의사항]
return과 값 사이에 새 줄을 넣어 코드를 작성하면 아무것도 반환하지 않는다.
function sum(one, two){
return
one + two
}
sum(3, 7) //undefined여러 줄에 걸쳐 작성하고 싶다면 괄호를 사용해야 한다.
function sum(one, two){
return (
one + two
)
}
sum(3, 7) //10[공부 좌표]
[참고]