2021. 8. 2. 11:20ㆍCSE/Java Script
1. 함수의 다양한 형태
(1) 콜백 함수
- 익명함수의 대표적인 용도
- 개발자는 단지 함수를 등록하기만 하고, 어떤 이벤트가 발생하거나 특정 시점에 도달 시, 시스템에서 호출되는 함수를 말함
- 특정 함수의 인자로 넘겨서, 코드 내부에서 호출되는 함수를 말하기도 함
<!DOCTYPE html>
<html><body>
<script>
window.onload = function(){
alert("This is callback function.");
} //웹 페이지가 로드가 되면 경고창을 띄운다
</script>
</body></html>
(2) 즉시 실행 함수 (immediate functions)
- 익명함수를 사용함
- 이 경우, 해당 함수를 다시 호출할 수 없다
=> 최초 한 번의 실행만을 필요로 하는 초기화 코드 부분 등에 사용
(function(name){
console.log('This is the immediate function => ' + name);
})('foo');- 대표적인 예시 : jQuery와 같은 자바스크립트 라이프러리나 프레임워크 소스들
=> 왜? : 다른 자바스크립트 라이브러리들이 동시에 로드가 되더라도 라이브러리 간 변수이름 충돌 문제 방지 가능
* 함수 유효 범위 : 함수 내부에서 var 문을 통해 정의된 변수들은 함수 코드 내부에서만 유효하다
(var 사용 안하면 전역 유효 범위를 갖게 됨)
(3) 내부 함수 (inner function)
- 함수 내부에 정의된 함수
- 클로저를 생성하거나 부모 함수 코드 내부의 헬퍼 함수를 구현하는 용도 등으로 사용
- 스코프 체이닝 때문에 내부 함수에서는 자신을 둘러싼 외부 함수의 변수에 접근이 가능하지만, 외부 함수에서는 내부 함수의 변수에 접근이 불가능하며, 부모 함수 밖에서는 내부 함수에 접근이 되지 않는다.
- 하지만, 부모함수가 리턴값으로 내부 함수를 리턴하는 경우에는 외부에서도 내부 함수 사용 가능하다.
function parent(){
var a = 100;
var b = 200;
function child(){
var b = 300;
console.log(a); //100
console.log(b); //300
}
console.log(b); //200
child(); //100, 300
return child;
}
inner = parent(); //200,100,300
inner();* 클로저 : 실행이 끝난 부모 함수 스코프의 변수를 참조하는 inner()와 같은 함수
2. arguments 객체
- 자바스크립트에서는 함수를 호출할 때, 함수 형식에 맞춰 인자를 넘기지 않더라도 에러가 발생하지 않는다.
=> 정해진 인자보다 적게 함수를 호출했을 경우 : 넘겨지지 않은 인자는 undefined 값을 가진다
=> 정해진 인자보다 많이 함수를 호출했을 경우 : 초과된 인수는 무시된다.
- arugments 객체 : 함수를 호출할 때 넘긴 인자들이 배열형태로 저장된 유사 배열 객체, 암묵적으로 함수 내부로 전달
- 호출된 인자의 개수를 확인하고, 이에 따라 동작을 다르게 해줘야 할 때, arugments 객체가 유용하다.
- 배열 : 함수를 호출할 때 넘겨진 인자
- length 프로퍼티 : 넘겨진 인자의 개수
- callee 프로퍼티 : 현재 실행 중인 함수의 참조값
function sum(){
var result = 0;
for (var i = 0; i<arguments.length; i++){
result += arguments[i];
}
return result;
}
console.log(sum(1,2,3)); //6
console.log(sum(1,2,3,4,5,6,7,8,9)); //45
'CSE > Java Script' 카테고리의 다른 글
| [Java Script] 함수와 프로토타입 체이닝 4 (0) | 2021.08.05 |
|---|---|
| [Java Script] 함수와 프로토타입 체이닝 3 (0) | 2021.08.05 |
| [Java Script] 함수와 프로토타입 체이닝 1 (0) | 2021.07.30 |
| [Java Script]데이터 타입과 연산자 3 (기본 타입과 표준 메서드, 연산자) (0) | 2021.07.27 |
| [Java Script]데이터 타입과 연산자 3 (배열) (0) | 2021.07.26 |