Javascript_bind()

jhson·2024년 1월 2일
0

javascript

목록 보기
16/19

bind()

  • JS에서 함수의 this 값을 설정하는 메서드
  • 함수를 호출할 때 어떤 객체를 this로 사용할지 명시적으로 지정할 수 있음
let stop_Watch{
	startTime : 0,
    endTime : 0,
    .
    .
    .
    start(){
    start 메서드 내용
    }
    end(){
   	end 메서드 내용
    }
}
.
.
.
startBtn.addEventListener("click", stop_Watch.start.bind(stop_Watch));
stopBtn.addEventListener("click", stop_Watch.stop.bind(stop_Watch));
.
.
.

- 이벤트 리스너 함수로 'stop_Watch.start' 와 'stop_Watch.stop' 을 전달하고 있음
- 그러나 이벤트 리스너 함수 내에서 'this'는 이벤트를 발생시킨 DOM 요소를 가리키게 됨
- 떄문에 'start'와 'stop' 메서드 내부에서 'this'를 사용할 때 'stop_Watch'객체를 가리키지 않고 예상과 다른 결과가 나올 수 있음
- 'bind'함수를 사용하여 명시적으로 'stop_Watch'객체를 'this'로 설정
- 이벤트 리스너 함수 내부에서 'this'는 항상 'stop_Watch'객체를 가리키도록 할 수 있음

profile
게임회사 주니어 개발pm에서 프론트엔드 개발자로 전향하는 과정

0개의 댓글