일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
1 | 2 | 3 | 4 | 5 | ||
6 | 7 | 8 | 9 | 10 | 11 | 12 |
13 | 14 | 15 | 16 | 17 | 18 | 19 |
20 | 21 | 22 | 23 | 24 | 25 | 26 |
27 | 28 | 29 | 30 |
- 어웨이트
- 자바스크립트기초
- 지역변수
- 코딩공부
- 캡쳐링
- addEventListener
- 비동기적
- 비구조화
- git
- text-align
- 논리연산자
- falsy
- truthy
- js
- 중앙정렬
- map()
- 버블링
- 프론트엔드
- 전역변수
- 이벤트위임
- 돔조작
- 자바스크립트
- async
- 이벤트리스너
- 단락회로평가
- INCLUDES
- icoMoon
- 동기적
- 리액트
- Await
- Today
- Total
피리부는 사나이 (pied piper)
[JS] 콜백 함수 본문
JS에선 함수도 객체, 일종의 값이 될 수 있음
이것이 다른 언어의 함수와 다름 점
function a () {}
//함수 a가 선언됐다. JS에선 함수는 객체의 값으로 포함될 수 있다.
a = {
b:function(){
}
};
//그런면에서 볼 때 함수명 a라는 변수에 함수b가 값으로 담겼다고도
//볼 수 있을 것이다.
그리고 이렇게 '객체'의 '속성값'으로 담겨진 함수가
**메소드이다.**
함수는 값이기 때문에 다른 함수의 인자로 전달 될수도 있다. 아래 예제를 보자.
function cal(func, num){
**return** func(num)
}
function increase(num){
**return** num+1
}
function decrease(num){
**return** num-1
}
alert(cal(increase, 1));
alert(cal(decrease, 1));
함수는 함수의 리턴 값으로도 사용할 수 있다.
function cal(mode){
**var** funcs = {
'plus' : **function**(left, right){**return** left + right},
'minus' : **function**(left, right){**return** left - right}
}
**return** funcs[mode];
}
alert(cal('plus')(2,1));
alert(cal('minus')(2,1));
당연히 배열의 값으로도 사용할 수 있다.
var process = [
**function**(input){ **return** input + 10;},
**function**(input){ **return** input * input;},
**function**(input){ **return** input / 2;}
];
var input = 1;
**for**(**var** i = 0; i < process.length; i++){
input = process[i](input);
}
alert(input);
처리의 위임
💡 함수의 인자로 함수를 전달할 수 있다고 했다. 이로써 함수의 동작을 완전히 바꿀 수 있다.
함수는 두 가지로 나눌 수 있다.
- 자바스크립트 객체에 내장되어있는 내장객체, 빌트인 메소드 2.우리가 흔히 만들어 선언하는 정의함수
즉 객체내 메소드의 ‘오리지널’ 기능을 인자에 함수를 전달함으로써 자유롭게 변경할 수 있다는 것 이것이 콜백의 필요성이다.
예시)
numbers = [숫자, 숫자, 숫자]; // numbers라는 배열 선언
배열이 갖고 있는 메소드중에 sort라는 것이 있음
numbers.sort(sortfunc);
💡
앞에 있는 것은 객체이다. sort(sortfunc)는 배열의 메소드이다 /코드 원소들간에 무엇이 우선인지를 판단하는 기능을 함
function sortNumber(a, b) {
return b-a;
}
var numbers = [20, 10, 9,8,7,6,5,4,3,2,1];
alert(numbers.sort(sortNumber));
// array, [20,10,9,8,7,6,5,4,3,2,1]
값으로 사용될 수 있는 특성을 이용하면 함수의 인자로 함수로 전달할 수 있다. 값으로 전달된 함수는 호출될 수 있기 때문에 이를 이용하면 함수의 동작을 완전히 바꿀 수 있다. 인자로 전달된 함수 sortNumber의 구현에 따라서 sort의 동작방법이 완전히 바뀌게 된다
'Java Script' 카테고리의 다른 글
[JS] 함수 표현식 VS 함수 선언식 (0) | 2022.02.17 |
---|---|
[JS] 배열과 객체의 차이 (0) | 2022.02.16 |
메서드와 This (0) | 2022.02.15 |
[자바스크립트] 객체안에 프로퍼티 유무 확인법 (0) | 2022.01.11 |
지역변수와 전역변수 (0) | 2022.01.06 |