1.callback 함수
- 어떤 이벤트가 발생했거나 특정 시점에 도달했을 때 시스템에서 호출되는 함수
- 특정 함수의 인자로 넘겨서, 코드 내부에서 호출되는 함수 또한 콜백 함수가 될 수 있다.
ex)이벤트 핸들러 처리 콜백 함수
· 웹페이지가 로드 되거나 키보드가 입력되는 등의 DOM 이벤트가 발생할 경우,
브라우저는 정의된 DOM 이벤트에 해당하는 이벤트 핸들러를 실행시킨다.
<!DOCTYPE html>
<html><body>
<script>
// 페이지 로드시 호출될 콜백 함수
window.onload = function(){
alert('This is the callback function.');
};
</script>
</body></html>2. 즉시 실행 함수(immediate function)
- 함수를 정의함과 동시에 바로 실행하는 함수
(function(name){
console.log('This is the immediate function -> ' + name);
})('foo');
//출력 결과 : This is the immediate function -> foo- JQuery 소스나 최초 한 번의 실행만을 필요로 하는 라이브러리 코드 로드 및 초기화 코드 부분 등에 사용한다.
(function(window, undefined){
...
})(window);· jQuery에서 즉시 실행 함수를 사용하는 이유는 자바스크립트의 변수 유효 범위 특성 때문이다.
자바스트립트에서는 함수 유효 범위를 지원한다.
3. 내부 함수 (inner function)
- 함수 코드 내부에서 정의된 함수
- 클로저를 생성하거나, 부모 함수 코드에서 외부에서의 접근을 막고 독립적인 헬퍼 함수를 구현하는 용도 등으로 사용
// parent() 함수 정의
function parent(){
var a = 100;
var b = 200;
// child() 내부 함수 정의
function child(){
var b = 300;
console.log(a);
console.log(b);
}
child();
}
parent();
child();
// 출력 결과
// 100
// 300
// Uncaught ReferenceError : child is not defined- parent(); 출력 결과가 성공인 이유
· 자바스크립트의 스코프 체이닝 때문이다. 내부 함수는 자신을 둘러싼 외부 함수의 변수에 접근 가능하다.
- child(); 출력 결과가 실패인 이유
· 자바스크립트의 함수 스코핑 때문이다. 함수 내부에 선언된 변수는 함수 외부에서 접근이 불가능하다.
- 함수 스코프 외부에서 내부 함수 호출하는 경우
function parent(){
var a = 100;
// child() 내부 함수
var child = function(){
console.log(a);
}
// child 함수 반환
return child;
}
var inner = parent();
inner();
// 출력결과 : 100· 부모가 자식을 return 하고 외부 변수가 그 결과를 받는 경우
※ 실행이 끝난 parent()와 같은 부모 함수 스코프의 변수를 참조하는 inner()와 같은 함수를 클로저라고 한다.
4. 함수를 리턴하는 함수
- 함수를 호출함과 동시에 다른 함수로 바꾸거나, 자기 자신을 재정의하는 함수를 구현할 수 있다.
//self() 함수
var self = function(){
console.log('a');
return function (){
console.log('b');
}
}
self = self(); // 출력 결과 : a
self(); // 출력 결과 : b'Language > Java Script' 카테고리의 다른 글
| 자바스크립트 프로토타입 체이닝 (0) | 2020.02.24 |
|---|---|
| 자바스크립트 함수 호출과 this (0) | 2020.02.23 |
| 자바스크립트 함수 객체 (0) | 2020.02.23 |
| 자바스크립트 함수 선언 (0) | 2020.02.23 |
| 자바스크립트 연산자 특이사항 (0) | 2020.02.23 |