코드 그라데이션
9. 함수와 이벤트 (3) 함수 표현식 본문
익명 함수
- 이름이 없는 함수
- 익명 함수를 선언할 때는 이름을 붙이지 않는다.
function(a, b) {
return a+b;
}익명 함수 실행하기
<body>
<script>
var sum = function(a, b){
return a + b;
}
document.write("함수 실행 결과 : " + sum(10, 20) );
</script>
</body>실행 결과
즉시 실행 함수
- 한 번만 실행하는 함수라면 함수를 정의하면서 동시에 실행할 수 있다.
- 즉시 실행 함수는 함수를 실행하는 순간에 자바스크립트 해석기에서 함수를 해석한다.
- 즉시 실행 함수는 함수를 식 형태로 선언하므로 마지막에 세미콜론을 붙인다.
기본형
예제
<body>
<script>
(function() {
var userName = prompt("이름을 입력하세요.");
document.write("안녕하세요? <span class='accent'>" + userName + "</span>님!");
}());
</script>
</body>실행 결과
매개변수가 있는 형태
- 선언 부분 끝에 함수 실행을 위한 인수를 넣어준다.
<body>
<script>
(function(a, b){ // 함수 선언을 위한 매개변수
sum = a + b;
}(100, 200)); // 마지막에 함수 실행을 위한 인수
document.write("함수 실행 결과 : " + sum);
</script>
</body>실행 결과
화살표 함수
기본형
매개변수 => { 함수 내용 }매개변수가 없는 경우 : 괄호 안을 비워둔다.
const hi = function() {
return "안녕하세요?";
}화살표 함수로 작성하면
const hi = () => { return "안녕하세요?" };한 줄 뿐이라면 중괄호 생략
const hi = () => "안녕하세요?";
매개변수가 1개인 경우, 매개변수 괄호는 생략 가능
<매개변수가 1개인 함수>
let hi = function(user) {
document.write(user + "님, 안녕하세요");
}<매개변수가 1개인 화살표 함수>
let hi = user => { document.write(user + "님, 안녕하세요?"); }
매개변수가 2개 이상인 경우 (매개변수) => {...} 처럼 사용한다.
- 매개변수를 추가하려면 괄호 안에 쉼표로 구분한다.
<매개변수가 2개인 함수>
let sum = function(a,b) {
return a+b;
}<매개변수가 2개인 화살표 함수>
let sum = (a, b) => a + b;
728x90
'Front > Mega-JavaScript' 카테고리의 다른 글
| 11. 자바스크립트와 객체 (1) 객체의 의미와 내장 객체 (0) | 2023.05.21 |
|---|---|
| 10. 함수와 이벤트 (4) 이벤트 처리기 관련 (0) | 2023.05.21 |
| 8. 함수와 이벤트 (2) let, const / 함수의 재사용 (1) | 2023.05.20 |
| 7. 함수와 이벤트 (1) var을 사용한 변수의 특징 (0) | 2023.05.20 |
| 6. 자바스크립트 기본 문법 (4) 반복문 (0) | 2023.05.20 |
'Front/Mega-JavaScript' Related Articles
more
Comments