jQuery의 각 메서드 정보(jQuery의 기능)_jquery

WBOY
풀어 주다: 2016-05-16 16:56:57
원래의
1479명이 탐색했습니다.

1. jQuery에서는 Each 메소드를 사용하는 사람이 많을 것으로 예상됩니다.

그럼 jQuery가 어떤 작업을 수행했는지 살펴보겠습니다.

jquery에서 각 소스 코드 찾기:

코드 복사 코드는 다음과 같습니다.

각: 함수( object, callback, args ) {
var name, i = 0,
length = object.length,
isObj = length === undefine || .isFunction( object );

if ( args ) {
if ( isObj ) {
for ( name in object ) {
if ( callback.apply( object[ name ], args ) === false ) {
break;
}
}
} else {
for ( ; i < length; ) {
if ( callback.apply( object[ i ], args ) = == false ) {
break;
}
}
}

// 각 <의 가장 일반적으로 사용되는 특별하고 빠른 사례입니다. 🎜>} else {
if ( isObj ) {
for ( name in object ) {
if ( callback.call( object[ name ], name, object[ name ] ) === false ) {
break;
}
}
} else {
for ( ; i < length; ) {
if ( callback.call( object[ i ], i, object[ i ] ) === false ) {
break;
}
}
}
}

return object;
이 코드는 비교적 간단해서 문제가 없을 것입니다.

이것을 테스트하기 위해 다음 js를 작성했습니다.




code
코드는 다음과 같습니다. $.each($(".demo"),function(){ console.log("show ");
});


그런 다음 HTML을 추가하세요.



코드 복사


그런 다음 jQuery 소스 코드를 사용하여 디버깅했습니다. 정확한 결과를 얻을 수 있었습니다. 하지만 안타깝습니다.

보시다시피 여기 객체는 제가 원하는 3개의 html 객체가 아니라 js의 8가지 내장 데이터 유형입니다.

뒤에 jquery 소스 코드에 코드 조각을 추가했습니다. jQuery의 각 메서드 정보(jQuery의 기능)_jquery



코드 복사
코드는 다음과 같습니다. console.log(Object.prototype.toString(object)); console.log(length)

이후의 입력은 다음과 같습니다. 다음은 다음과 같습니다.

즉, 문서가 로드되면 jQuery는 DOM 개체가 사용되지 않더라도 각 개체를 사용하여 dom 개체를 순회합니다.

jQuery의 각 메서드 정보(jQuery의 기능)_jquery

코드 복사

지정된 객체를 순회한 후에도 버블링은 계속해서 상위 요소를 순회합니다.

2. jQuery 소스코드에 따라 콜백 함수 매개변수를 사용합니다




코드를 복사합니다
코드는 다음과 같습니다. $.each($(".demo"),function(a,b){ console.log(a "" $(a).attr("class")) ;
} )


소스 코드에서 볼 수 있습니다:



코드 복사
코드는 다음과 같습니다. callback.call( object[ i ], i, object[ i ] )
마지막으로 현재 개체가 콜백에 전달됩니다. call 메소드를 통해 함수를 호출한 다음 위와 같이 진행할 수 있습니다. 현재 객체의 속성을 사용하세요. 물론 이것을 이용해 직접 호출할 수도 있습니다.

더 복잡한 것에 대해 이야기하는 경우, 예를 들어 여기서는 $(".demo")를 $.each()에 객체로 전달합니다.

가끔 jQuery 또는 html 객체가 전달되지 않는 경우도 있습니다. . 그러나 객체 또는 배열입니다.

그리고 배열에는 다른 객체나 메소드도 많이 있습니다.

이렇게 하면 더 많은 효과를 얻을 수 있습니다.

3. call 또는 Apply를 사용하여 콜백 모드를 구현합니다.

위 코드에서 볼 수 있듯이




코드 복사
코드는 다음과 같습니다. callback.call(obj,args)

코드 복사 코드는 다음과 같습니다.

callback.apply([obj],args )

과 같은 코드의 경우 콜백 함수를 전달하여 직접 호출하기만 하면 되며 이는 코드 재사용을 향상시키는 데 매우 유용합니다.

그러나 코드 가독성 저하, 결합도 증가 등 몇 가지 단점도 있습니다.

가끔 떠오르는 게 있으면 녹음해서 잊어버리지 않도록 하세요!
관련 라벨:
원천:php.cn
본 웹사이트의 성명
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.
최신 이슈
인기 튜토리얼
더>
최신 다운로드
더>
웹 효과
웹사이트 소스 코드
웹사이트 자료
프론트엔드 템플릿