JavaScript 함수에 별칭을 적용하면 일부 브라우저에서는 오류가 발생하고 다른 브라우저에서는 오류가 발생하지 않는 이유는 무엇입니까?

JavaScript 함수 별칭 지정: 예상치 못한 방해

질문:

별명 및 함수 래퍼 메서드를 모두 사용하려고 시도했지만 document.getElementById 별칭 지정이 실패했습니다. Firefox, Chrome, 심지어 디버그 창에서도 마찬가지입니다. Firefox에서는 오류가 발생하고 Chrome에서는 "잘못된 호출"이 발생합니다. 또한 이 작업은 Internet Explorer 8에서 작동합니다.

조사:

심층 분석 결과 문제는 JavaScript 함수가 개체에 느슨하게 연결되고 범위와 상호 작용하는 방식에 있습니다.

설명:

JavaScript 함수를 호출할 때 인터프리터는 범위를 할당하고 이를 함수에 전달합니다. 함수가 범위를 참조하기 위해 이것을 사용하는 경우 이 값은 전달된 범위가 됩니다.

그러나 Apply 메서드를 사용하여 범위를 수동으로 지정할 수 있으며, interpreter.

별칭 문제:

$('someElement')를 호출할 때 범위가 문서가 아닌 창 개체로 설정되기 때문에 document.getElementById를 $로 별칭을 지정하면 오류가 발생합니다. 물체. 결과적으로 getElementById 구현에서 범위가 문서일 것으로 예상하는 경우 함수가 실패합니다.

수정:

이 문제를 해결하려면 $.apply(document, [' someElement']) 문서 개체에 대한 범위를 명시적으로 설정합니다.

Internet Explorer에서 작동하는 이유:

Internet Explorer에서 앨리어싱이 예기치 않게 성공한 이유는 IE에서 다음과 같은 사실 때문일 수 있습니다. 에서 window 개체는 document 개체와 동일합니다. 이 경우 IE에서 앨리어싱이 제대로 작동해야 합니다.

종합적인 예:

문제를 더 자세히 설명하려면 다음 Person 함수를 고려하세요.

function Person(birthDate) {
  this.birthDate = birthDate;
  this.getAge = function() { return new Date().getFullYear() - this.birthDate.getFullYear(); };
  this.getAgeSmarter = function() { return this.getAge(); };
  this.getAgeSmartest = function() { return (this.constructor == Person ? this : self).getAge(); };
}

With 생성된 Person 클래스의 두 인스턴스인 yogi와 anotherYogi에 해당하는 출력은 다음과 같습니다.

• console.log(yogi.getAge()): 100(올바른)
• console. log(ageAlias()): -1(잘못된 범위)
• console.log(ageAlias.apply(yogi)): 100(올바른 범위)
• console.log(ageSmarterAlias()) : 100(올바른 범위)
• console.log(ageSmarterAlias.apply(anotherYogi)): 100(잘못된 범위)
• console.log(ageSmartestAlias()): 100(올바른 범위)
• console.log(ageSmartestAlias.apply(document)): 100(올바른 범위)
• console.log(ageSmartestAlias.apply(anotherYogi)): 200(올바른 범위)

이 예는 범위의 복잡성과 함수에 별칭을 지정할 때 적용 메서드 사용의 중요성을 보여줍니다.

위 내용은 JavaScript 함수에 별칭을 적용하면 일부 브라우저에서는 오류가 발생하고 다른 브라우저에서는 오류가 발생하지 않는 이유는 무엇입니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!