자바스크립트 스터디노트 Black.Caffeine 09.11.28_기초지식

1. 이전에는 항상 분산된 함수를 작성했는데, 그냥 사용하는 함수가 부족하다는 생각이 들어서 이번에는 캡슐화된 클래스를 작성했는데, 문제가 많이 발생했습니다. 매개변수를 전달할 때 문제가 발생하여 많은 정보를 참고하여 정리했습니다.
1) 동적 바인딩 이벤트 문제:
onclick 이벤트는 목록 항목과 같은 개체에 바인딩되어야 합니다. 이벤트에 함수 작업을 추가하려면 이벤트를 덮어쓰는 대신 addEventListener 또는 attachmentEvent를 사용해야 합니다. 그러나 AttachEvent는 FF를 지원하지 않으며 FF는 addEventListener만 사용할 수 있습니다. 그래서 이 둘을 결합하는 함수가 필요해서 이 함수가 탄생하게 되었습니다.

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

function addEventHandler(oTarget, sEventType, fnHandler)
{
if(oTarget.addEventListener)
{oTarget.addEventListener(sEventType, fnHandler, false);}
else if(oTarget.attachEvent)
{oTarget.attachEvent('on' sEventType, fnHandler);}
else{oTarget['on' sEventType] = fnHandler;}
}

2) 이 매개변수 전달 문제:
함수와 속성을 클래스로 캡슐화했으므로 onclick과 같은 이벤트를 바인딩할 때 문제가 발생합니다(예: addEventHandler(this.elems[i],"click") ,this.Move);, 이것은 잘못된 것입니다. onclick 이벤트가 발생할 때 호출된 this가 이 캡슐화된 클래스를 가리키지 않기 때문에 apply()를 사용해야 합니다. ~——객체의 메소드를 적용하고 현재 개체를 다른 개체와 함께 사용합니다. 특정 형식을 언급할 필요는 없습니다. 인터넷에는 많은 기능이 있습니다.

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

var Bind = function(object,func){
var args = Array.prototype.slice.call(arguments).slice(2)
return function( ){
return func.apply(객체,인수);
                                                                                                               클래스에 캡슐화되어 정의된 멤버 함수입니다.
//this.elems[i].onclick=this._fnMove;// 위 문장을 이 문장으로 바꾸는 것도 가능하지만 onclick 이벤트는 this._fnMove
addEventHandler(this.elems[i],"click",this._fnMove)

를 추가하는 대신 this._fnMove로 대체됩니다. 괜찮습니다~
PS.call( )은 기본적으로 동일한 함수이지만, 구체적인 매개변수가 다릅니다
2.setInterval 문제
1) setTimeout과의 차이점
일반적으로 setTimeout만 실행됩니다. 한 번(물론 setTimeout을 호출하는 함수에서 반복하면 반복적으로 실행될 수 있음) setInterval은 ClearIntercal()까지 반복적으로 실행될 수 있습니다.
2) IE에서의 비호환 문제
이 문제는 나를 50% 괴롭혔습니다. 아, 사세요, 미래에는 IE와 싸우느라 인생의 절반을 낭비하시겠습니까? . .
원래는 크롬, ff, 사파리에서 너무 잘 돌아가서 IE도 잊어버렸어요. . . 나중에 IE에서 시도했는데 완성된 것으로 나타났습니다. 수정하고 검색해 보았습니다(여기서는 동사, 헤헤). 기본적으로 하루 종일 걸렸고 마침내 완료되었습니다. 이전에는 명령문이 다음과 같았습니다. this.timer=setInterval(this.unfold,5,this.divs[index],this) 결과는 IE에서 완전히 사용할 수 없었습니다. 마지막으로 한 영웅님의 글에서 다음과 같은 설명을 봤습니다. IE에서는 setTimeout과 setInterval이 매개변수 전달을 지원하지 않습니다. 문제가 너무 잘 해결되었네요~
문제를 해결했습니다.




코드 복사

코드는 다음과 같습니다. var mySetInterval = setInterval; 🎜>window .setInterval = function(callback, 간격) { var args = Array.prototype.slice.call(arguments, 2)

function callFn(){callback.apply(null, args) );}

return mySetInterval(callFn, 간격);
}

var mySetTimeOut = setTimeout; //setInterval 수정
window.setTimeout = function(callback, timeout)
{
var args = Array.prototype.slice.call(arguments, 2);
function callFn(){callback.apply(null, args);}


그런 다음 window를 사용합니다. setTimeout 또는 window .setInterval을 호출하면 됩니다~
제 문장은 다음과 같이 수정됩니다.
this.timer=window.setInterval(this.unfold,5,this.divs[index],this) //그 중, this.divs [index], 전달된 두 매개변수입니다
나를 모르는 그 영웅에게 다시 한 번 감사드립니다~
현재 IE에는 여전히 작은 레이아웃 문제가 있습니다. 계속해서 배워보세요~ 완전 토끼!