728x90
300x250
bind
bind() 메소드는 호출될 때 this 키워드가 제공된 값으로 설정되는 새로운 함수를 반환한다.
syntax
bind(thisArg, arg1, ... , argN)
- thisArg : this가 가리킬 객체를 지정
- arg1, ... , argN : 함수에 전달할 인자 값
thisArg는 전달하지 않고 null을 사용할 수도 있다.
그 다음 전달 인자 값은 배열 타입으로 전달한다. 인자를 배열로 전달하는 것을 보면 apply와 비슷해 보이지만 bind는 함수를 호출하지 않고 생성하고 반환하는 점에서 차이점이 있다.
bind 메소드 사용 예시
yourName = {
name:'jone',
callName: function() {
return this.name;
}
}
yourName.callName(); //'jone' 호출
위에 예제를 보면 yourName의 callName() 메소드를 호출하면 this.name을 리턴한다.
여기서 this는 yourName을 가르키고 name 프로퍼티 값인 jone이 호출된다.
그럼 아래와 같이 yourName.callName;을 callyou변수에 넣고 호출하면 어떻게 될까?
callyou = yourName.callName;
callyou();
여기서 this는 window 객체를 나타내고 윈도우 객체에 name이 없기 때문에 가져올 수있는 값이 없다.
이럴 경우 bind 함수를 사용해서 해결할 수 있다.
you = callyou.bind(yourName);
you(); // 'jone' 호출
위와 같이 bind를 사용하여 this 키워드가 yourName을 가리키게 하면 제대로 나오는걸 확인할 수 있다.
이렇게 this가 어떤 인스턴스를 가르킬지 선택할 수 있다.
728x90
반응형
'javaScript > J Query & 스크립트' 카테고리의 다른 글
hasClass를 javaScript로 표현하기 (0) | 2022.05.17 |
---|---|
Document.readyState 자바스크립트 (0) | 2022.05.16 |
자바스크립트 addEventListener 이벤트 추가하기 (0) | 2022.05.13 |
메소드 call에 대해서 (0) | 2022.05.12 |
just-in-time 컴파일 이란? (0) | 2022.05.11 |
댓글