* Callback Function
- callback function을 이용한 함수 위임
* callback function 사용하기 전
// callback함수 사용전
function register() {
const isConfirm = confirm(
'회원가입에 성공했습니다.',
);
if (isConfirm) {
redirectUserInfoPage();
}
}
function login() {
const isConfirm = confirm(
'로그인에 성공했습니다.',
);
if (isConfirm) {
redirectIndexPage();
}
}
* callback function 사용후
// callback 사용후
function confirmModal(message, cbFunc) {
const isConfirm = confirm(message);
if (isConfirm && cbFunc) {
cbFunc();
}
}
- callback함수는 callback을 받아서 실행을 하는것이기 때문에 함수를 실행시키지 않고 함수 그 자체를 넘겨줘야한다.
그래야 받은쪽에서 함수를 받고 실행시킨다.
* callback 다른 예시
function register() {
confirmModal('회원가입에 성공했습니다.', redirectUserInfoPage);
}
function login() {
confirmModal('로그인에 성공했습니다.', redirectIndexPage);
}
- callback함수를 통해서 제어권을 다른 함수에 넘기고 그 함수에서 내가 만든 함수를 제어를 하고 실행을 시키는 권한을 가지게 된다.
- callback함수를 무조건 프로미스로 바꾸고 async await로 바꿀수있는 안좋은 패턴이다라고 생각하지말고 제어권을 위임할 수 있다는걸 알면 보기좋게 리팩토링 할 수있다.
- callback함수는 함수를 다른 함수에 넘겨서 제어권을 위임할 수 있다.
- callback함수를 이용하면 어느정도 활용도 있게 코드를 고쳐나갈 수 있다.
- 함수의 역할이 다른곳에 넘어가다보면 추상화하고 계층을 나누는데 도움이 된다.
'Study > JavaScript(Clean code)' 카테고리의 다른 글
[JavaScript][clean-code] 클로저 (Closure) (0) | 2022.06.15 |
---|---|
[JavaScript][clean-code] 순수 함수(pure function) (2) | 2022.06.15 |
[JavaScript][clean-code] 화살표 함수 (Arrow function) (0) | 2022.06.13 |
[JavaScript][clean-code] void & return (0) | 2022.06.13 |
[JavaScript][clean-code] Rest Parameters (0) | 2022.06.13 |