선착순 모집! 국비지원 받고 4주 완성질문 지켜보기
// 특정 섹션으로 이동하는 함수
function toSection(sectionName) {
$('html, body').animate({scrollTop: $(sectionName).position().top}, 500);
// 매개변수로 들어온 섹션의 top위치로 스크롤 이동
}
$('#about-btn').on('click', toSection);
$('#contact-btn').on('click', toSection);풀었던 문제인데 조금 손보다가 모르는게 생겨서 질문 올립니다.
원래는
function toAbout() { $('html, body').animate({scrollTop: $('.about').position().top}, 1000); }
function toContact() { $('html, body').animate({scrollTop: $('.contact').position().top}, 1000); }이렇게 함수 2개를 만들어서 제출했었는데, 맨 위 코드처럼 특정 섹션으로 스크롤을 이동하게 하고, 그 섹션 이름은 매개변수로 받게 하면 함수는 하나만 있어도 되겠다 싶어서 맨 위 코드처럼 고쳤습니다.
$('#about-btn').on('click', toSection('.about'));그런데 이런식으로 작성하니 에러나고.. 구글링해서 찾아보니
$('#about-btn').on('click', function() {
toSection('.about');
});이렇게 익명함수를 호출한 다음에 함수를 호출하는 식으로 사용하는 방법들이 나옵니다.
근데 익명함수를 쓰지 않고 바로 함수에 매개변수를 전달하는 방법이 있을 것 같은데... 저로썬 찾기가 어렵습니다...
함수에 바로 매개변수를 전달할 방법이 있을까요??
추가로 제가 처음에 했던 방법과 지금 하려는 방법 중에 어떤 식으로 코드를 작성하는게 더 좋은 코드인가요?
+0
A
1개의 답변이 있어요
커뮤니티 파트너 채택
저도 이런 문제 때문에 한참 찾아보다가 알게 된 게 javascript의 binding 이라는 방법이 있어요. 공부하실 수 있으시다면 한 번 해보시길 추천드려요!
function toSection(sectionName) {
$('html, body').animate({scrollTop: $(sectionName).position().top}, 1000)
}
$('#about-btn').on('click', toSection.bind(null, '.about'))
$('#contact-btn').on('click', toSection.bind(null, '.contact'))요렇게 하면 일단 동작할 수 있어요!
아직 저도 정확하게 모르지만 사용법만 알고 있어서 공유 해드리는거에요!
댓글 1개