프론트 엔드 개발자는 Javscript 스크립트의 함수 개체가 호출 또는 적용 메서드를 사용하여 내부 범위(this)가 가리키는 개체를 변경하여 보다 확장 가능한 기능 개발을 달성할 수 있다는 점을 잘 알고 있어야 합니다. IE는 기본적으로 함수 개체의 호출 및 적용 메서드를 지원하며 Firefox 또는 기타 브라우저에서도 지원됩니다. 그러나 호출 및 적용 메서드는 즉시 작동하고 실행됩니다. 예:
var func = function () {
alert(this); .apply(window);
스크립트 파싱 엔진이 이 코드를 실행하면 대화 상자가 즉시 나타나고 개체 문자열이 표시됩니다. 우리의 원래 의도는 window 객체 필드에 작용하고 나중에 호출될 때 실행하도록 func 메서드를 정의하는 것이었지만, 호출 및 적용 메서드는 원래 의도를 충족할 수 없으므로 즉시 실행됩니다.
몇 가지 기술 정보를 검색한 결과, Firefox는 기본적으로 바인드 메소드를 지원한다는 사실을 발견했습니다. 이 메소드는 정의가 완료된 후를 제외하면 호출 및 적용과 동일합니다. , 이 메서드는 나중에 실행됩니다. 그러나 이 바인딩 방법은 IE10 버전 이하의 브라우저에서만 기본적으로 지원됩니다. 이 버전보다 낮은 버전의 브라우저에서 실행하면 정의되지 않은 오류 메시지가 나타납니다. 그래서 우리는 솔루션을 찾기 위해 다시 온라인에 접속해야 했고, 노력한 결과 Firefox 개발 스테이션에서 솔루션을 찾았습니다. 이는 모든 브라우저가 바인드 메소드를 지원할 수 있도록 속성 프로토타입을 추가하는 것입니다. 다음:
if (!Function.prototype. 바인딩) {
Function.prototype.bind = function (oThis) {
if (typeof this !== "function") {
// ECMAScript 5 내부 IsCallable 함수에 가능한 가장 가까운 것
throw new TypeError("Function.prototype.bind - 바인딩하려는 항목을 호출할 수 없습니다.")
}
var aArgs = Array.prototype.slice.call(arguments, 1),
fToBind = this,
fNOP = function () {} ,
fBound = function () {
return fToBind.apply(this 인스턴스of fNOP && oThis
? this
: oThis,
aArgs.concat(Array.prototype.slice.call(arguments )));
}; fNOP.prototype = this.prototype;
fBound.prototype = new fNOP(); ;
};
}
이 코드를 이해하려면 약간의 지식이 필요합니다. 이 소스 코드의 원리를 소개하는 데 관심이 있는 사람이 있을 뿐입니다. 고마워요, 고마워요!
단순함은 태도가 아니라 일종의 만족입니다.