함수표현식
일반 함수 정의문의 경우 함수명을 선언하고 그 이름을 사용해서 호출한다.
이 방법은 함수이름만 알고 있으면 어디서나 함수를 실행할 수 있어서 많이 사용한다.
이 밖에 함수이름을 지정하지 않고 사용하거나, 함수를 호출하지 않고 바로 실행하는
함수도 있다. 함수 중 익명함수나 즉시 실행함수를 모두 함수 표현식이라고 한다.
익명함수
익명함수는 이름이 없는 함수를 말한다. 즉, 익명함수를 선언할때에는 이름을 붙이지 않는다.
[기본형]
let 변수명 = function(){
자바스크립트 코드;
}
변수명();
*익명함수는 호이스팅 기능이 없으므로 함수 호출을 할때에는 함수를 먼저 등록해놓아야 에러가 안뜬다.
즉시 실행 함수
일반적으로 함수는 선언하고 필요할때마다 호출해서 실행하는 방법을 많이 사용한다.
하지만 한 번만 실행하는 함수라면 함수를 정의하면서 동시에 실행할 수 있다.
바로 즉시 실행 함수를 이용하면 된다.
즉시 실행 함수는 함수를 실행하는 순간에 자바스크립트 해석기에서 함수를 해석함. 보통 제이쿼리에서 많이 사용함.
[기본형]
(function(매개변수){
자바스크립트 코드;
})(인수)
*다른 두 수를 더하는 즉시 실행 함수를 만들어주세요.
(function (a, b) {
document.write(a + b, "<br/>");
})(2, 3);즉시 실행함수로 지역함수를 안전하게 보관하면서 함수를 실행시키는 방법
아래 예시를 보면 개발자 A,B모두 동일한 이름의 변수와 함수를 선언했다.
하지만 각각 즉시 실행함수로 감싸놓아 각 변수와 함수는 즉시실행 함수 안의 스코프(유효범위)를 가진다.
즉, 개발자 A함수에 있는 num과 menu()는 개발자 B가 선언한 num과 menu()와 각각 다른 함수와 변수로 취급된다.
그렇기 때문에 변수나 함수의 충돌 없이 함수가 정상 실행된다.
*각각의 함수들은 블록스코프를 가지기때문에 충돌없이 정상적으로 값이 출력된다.
화살표 함수
ES버전부터는 => 표기법(화살표 표기법)을 사용해서 함수 선언을
좀 더 간결하게 할 수 있다. 화살표 함수는 익명 함수에서만 사용할 수 있다.
[기본형]
1.
let 변수 = (매개변수) => {자바스크립트 코드}; ->선언문
변수명(인수); ->호출문
[기본형]
①매개변수가 없을 경우
: 매개변수가 없을 경우에는 매개변수의 괄호 안을 비워둔다.
호출문의 인수 자리도 비워둔다.
let 변수 = () => {자바스크립트 코드}; ->선언문
변수명(); ->호출문
②실행할 자바스크립트 코드가 1줄인 경우
:실행할 자바스크립트 코드가 1줄이라면 중괄호를 생략할 수 있다.
이때 return문은 생략된 것으로 간주한다.
let 변수 =() => 자바스크립트 코드;
실행할 자바스크립트 코드가 두 줄 이상이면 {}와 return 생략 불가능
let변수 = () =>{
자바스크립트 코드1;
자바스크립트 코드2;
return 반환값;
}
③매개변수가 1개인 경우
:매개변수가 1개인 경우 매개변수 자리에 ()를 생략할 수있다.
let 변수 = 매개변수 => 자바스크립트 코드;
④매개변수가 2개 이상인 경우
: 매개변수가 둘 이상인 경우 (매개변수)=>{코드} 형태를 사용한다.
일반적인 익명함수와 마찬가지로 매개변수끼리는 ,로 구분한다.
let 변수 = (매개변수1, 매개변수2) => {자바스크립트 코드;}
값 4가 문서에 출력된다.
