ホームページ > ウェブフロントエンド > jsチュートリアル > jQuery と JavaScript では「this」の動作はどのように異なりますか?

jQuery と JavaScript では「this」の動作はどのように異なりますか?

Patricia Arquette
リリース: 2024-10-26 03:44:03
オリジナル
822 人が閲覧しました

How does

jQuery と JavaScript の「this」を理解する

「this」は JavaScript と jQuery の非常に汎用性の高いキーワードです。その意味は、使用されるコンテキストによって異なります。

jQuery の「this」

jQuery では、通常、「this」は、によって操作される DOM 要素を指します。呼び出される関数。たとえば、イベント コールバック ハンドラー内:

$("div").click(function() {
    // Here, "this" refers to the DOM element for the clicked div.
    this.style.color = "red";
});
ログイン後にコピー

JavaScript の「this」

JavaScript では、「this」の意味は呼び出しコンテキストによって決まります。 (定義コンテキストではありません):

  • オブジェクト メソッド: オブジェクトのプロパティとして呼び出された場合、「this」はそのオブジェクトを参照します。
var obj = {
    foo: function() {
        alert(this.firstName);
    },
    firstName: "Fred"
};
ログイン後にコピー
  • 関数呼び出し: 関数がオブジェクトにバインドされずに呼び出された場合、「this」はデフォルトでグローバル オブジェクト (通常はブラウザーの「ウィンドウ」) になります。
function foo() {
    alert(this.firstName);
}
ログイン後にコピー
  • Function.call(): ".call()" メソッドを使用すると、関数呼び出しの "this" の値を明示的に指定できます。
foo.call(obj, 42, 27);
ログイン後にコピー
  • Function.apply(): 「.call()」に似ていますが、個々の引数の代わりに引数の配列を受け取ります。
foo.apply(obj, [42, 27]);
ログイン後にコピー

特別な考慮事項:

  • ES5 の strict モードでは、デフォルトで「object」になるルーズ モードとは異なり、「this」には任意の値を指定できます。
  • jQuery は、「.each」メソッドで「this」のわずかに異なる実装を使用します。
  • 「this」を完全に理解するには、JavaScript の呼び出しコンテキストとオブジェクトのスコープをより深く調べる必要があります。

以上がjQuery と JavaScript では「this」の動作はどのように異なりますか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

ソース:php.cn
このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
著者別の最新記事
人気のチュートリアル
詳細>
最新のダウンロード
詳細>
ウェブエフェクト
公式サイト
サイト素材
フロントエンドテンプレート