ホームページ > 記事 > ウェブフロントエンド > JavaScript 関数のエイリアスによって一部のブラウザではエラーが発生し、他のブラウザではエラーが発生しないのはなぜですか?
エイリアス メソッドと関数ラッパー メソッドの両方を使用しようとしても、document.getElementById のエイリアスが失敗しますFirefox、Chrome、さらにはデバッグ ウィンドウでも。 Firefox ではエラーが発生しますが、Chrome では「不正な呼び出し」が発生します。さらに、この操作は Internet Explorer 8 でも動作します。
詳細な分析の結果、問題は JavaScript 関数がオブジェクトに緩やかに関連付けられ、スコープと対話する方法にあることがわかりました。
JavaScript 関数を呼び出すとき、インタープリターはスコープを割り当てて関数に渡します。関数がスコープを参照するために this を使用する場合、this の値は渡されたスコープになります。
ただし、apply メソッドを使用してスコープを手動で指定し、 interpreter.
document.getElementById を $ としてエイリアスするとエラーが発生します。これは、$('someElement') を呼び出すと、スコープがドキュメントではなくウィンドウ オブジェクトに設定されるためです。物体。したがって、getElementById の実装がスコープがドキュメントであることを予期している場合、関数は失敗します。
この問題を解決するには、$.apply(document, [' someElement']) を使用して、スコープをドキュメント オブジェクトに明示的に設定します。
Internet Explorer でのエイリアスの予期せぬ成功は、IE でのエイリアシングの予期せぬ成功に起因する可能性があります。 、ウィンドウ オブジェクトはドキュメント オブジェクトと同等です。その場合、エイリアシングは 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 クラスの 2 つのインスタンス、yogi と anotherYogi。対応する出力は次のとおりです:
この例は、スコープの複雑さと、関数のエイリアス作成時に apply メソッドを使用することの重要性を示しています。
以上がJavaScript 関数のエイリアスによって一部のブラウザではエラーが発生し、他のブラウザではエラーが発生しないのはなぜですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。