원인:
오늘 Master Snandy의 jQuery 읽기(DOM 요소 가져오기) 5장을 읽으면서 toArray() 메서드가 언급된 것을 보았습니다. 구체적인 jQuery 코드는 다음과 같습니다.
toArray: function() {
return Slice.call( this, 0 );
},
get: function( num ) {
return num == null ?
// '깨끗한' 배열 반환
this.toArray() :
// 반환 단지 객체
( num < 0 ? this[ this.length num ] : this[ num ] ),
여기서 call() 메서드를 확인하세요. 이전에 매뉴얼을 읽어본 적이 있는데, 객체 가장이며 상속을 위해 사용된다는 내용이었습니다. jQuery 소스코드가 좀 지저분해서 이 부분을 추출해서 별도의 파일에 넣어서 구체적인 실행을 살펴봤습니다.
근데 아직 잘 이해가 안가서 오늘은 콜 스터디를 하기로 했어요. 그래서 MDN의 지침을 확인하고 즉흥적으로 "해바라기 컬렉션"-옥스포드 사전을 꺼내서 영어를 연습하고 향상시키며 도움이 필요한 친구들에게 도움을 줄 준비가 되었습니다. 번역) 빠져나가는 점 양해 부탁드립니다!)
call
요약:
this와 인수를 제공하여 함수
를 호출합니다. 참고: 이 메서드의 구문은 apply 메서드와 유사합니다. 차이점은 다음과 같습니다. call()은 매개변수 목록을 허용하는 반면, apply()는 함수에 전달된 매개변수 배열을 허용합니다.
함수 클래스의 메서드: JavaScript 버전 1.3 이상
구문:
fun. call(thisArg[, arg1[, arg2 [, ...]]])
매개변수 설명:
thisArg:
fun() 호출에 대한 개체를 지정합니다. 참고: 표시되는 이 값은 실제 값이 아닐 수 있습니다. 이 메서드가 엄격하지 않은 모드에 있는 경우 null 및 정의되지 않은 값은 전역 객체로 대체되고 원래 값은 캡슐화됩니다.
arg1,arg2,....
이 개체의 매개 변수
설명:
기존 함수 호출 시 다른 개체를 할당할 수 있습니다. 이때, 이것으로 지정되는 객체는 현재 호출되는 객체이다.
호출을 사용하면 메서드를 한 번만 작성하고 다른 개체에 상속받을 수 있습니다. 새 개체를 직접 만드는 대신 이 메서드를 재정의하세요. (즉, 객체 사칭에 대한 예시는 아래에 있습니다!)
MDN 공식 홈페이지에 예시가 있습니다. 게다가 우연히 stackoverflow에서 관련 질문을 보게 되었는데, 그 안에 있는 답변을 보고 바로 객체 가장이 어떻게 발생했는지 이해하게 되었습니다.
아래에서 해당 부분을 추출하세요(원문을 읽으려면 여기를 클릭하세요):
Javascript에서는 런타임 시 개체의 메서드를 다른 개체에 바인딩할 수 있습니다. 간단히 말해서, JavaScript에서는 개체가 "대여"될 수 있습니다. 다른 개체의 메서드:
object1 = {
이름:'frank',
greet:function(){
alert('hello ' this.name)
}
}
object2 = {
이름: 'andy'
};
// object2에는 Greeting 메서드가 없습니다.
// 그러나 object1에서 "빌려올" 수 있습니다.
object1.greet.call(object2);
함수 개체의 호출 및 적용 메서드(자바스크립트 함수도 개체임)를 사용하면 코드에서 Nodelist가 배열의 슬라이스 메서드를 차용한다고 말할 수 있습니다. 슬라이스가 결과대로 또 다른 배열을 반환한다는 사실입니다.
여기서 첫 번째 문장은 매우 명확하며 일반적인 의미는 JavaScript에서 객체의 메서드를 다른 객체에 바인딩할 수 있다는 것입니다. 간단히 말해서, JavaScript는 객체가 자신에게 속하지 않는 메소드를 '빌려' 사용할 수 있도록 허용합니다. "가장"은 자명합니다. 위의 예에서 object2는 object1의 메서드를 호출하기 위해 object1인 것처럼 가장합니다.
PS: 초보자가 처음으로 블로그를 작성하는 것은 다소 지저분합니다. 앞으로는 모든 형제 자매들에게 블로그 작성 방법을 배우게 될 것이라고 믿습니다. 좋은 블로그를 쓰세요. 또한, 저에게 비판과 지도를 주시는 모든 분들을 환영합니다!
참고 자료:
1.w3cschool ECMAScript 상속 메커니즘 구현
2.
MDN 통화 안내
3.
스택오버플로우