JavaScript でのこれの使用法

日々の勉強の中でよく見かける使い方です。この記事で詳しく説明します。

あなたは次の JS 面接の質問に遭遇したかもしれません:

var obj = {  foo: function(){    console.log(this)
  }
}var bar = obj.foo
obj.foo() // 打印出的 this 是 objbar() // 打印出的 this 是 window

最後の 2 行の関数の値が異なる理由を説明してください。

——-

これに対する初心者の理解は常に曖昧でした。今日の記事では、それをすべて説明します。

そして、この説明は他では見ることができません。この記事を理解してください。これに関する面接の質問はすべて単なるおかずです。

関数呼び出し

まず、関数呼び出しから始める必要があります。

JS (ES5) には 3 つの関数呼び出し形式があります:

func(p1, p2)
obj.child.method(p1, p2)
func.call(context, p1, p2) // 先不讲 apply

一般に、初心者は最初の 2 つの形式を知っており、最初の 2 つの形式が 3 番目の形式よりも「優れている」と考えています。

この記事を読むと、3 番目の呼び出し形式が通常の呼び出し形式であることを覚えておく必要があります:

func.call(context, p1, p2)

他の 2 つは構文 Sugar であり、同等に呼び出しに変更できます。形式:

func(p1, p2) は func.call(unknown, p1, p2) と同等ですobj.child.method(p1, p2) は obj.child.method(obj.child, p1, p2)

メモしておいてください。 (以下では、簡単に参照できるように、このコードを「変換コード」と呼びます)

これまでのところ、関数呼び出しの形式は 1 つだけです:

func.call(context, p1, p2)

このようにして、これは説明できます

これは上記のコードのコンテキストです。それはとても簡単です。

これは、関数を呼び出すときに渡されるコンテキストです。関数呼び出しの呼び出し形式を使用することはないため、それを知ることはできません。

まず func(p1, p2) でこれを決定する方法を見てください:

次のコードを書くと

function func(){ console.log(this)}func()
等价于
function func(){ console.log(this)}func.call(undefined) // 可以简写为 func.call()

論理的に言えば、出力された this は未定義である必要がありますが、ブラウザーにはルールがあります:

If渡したコンテキストが null または未定義の場合、ウィンドウ オブジェクトがデフォルト コンテキストになります (厳密モードのデフォルト コンテキストは未定義です)
つまり、上記の出力結果は window です。

これがウィンドウではないことを望む場合、それは非常に簡単です:

func.call(obj) // そして、この内部はobjオブジェクトです

obj.child.method(p1)のこれを決定する方法を見てみましょう, p2)

var obj = { foo: function(){   console.log(this)
 }
}
obj.foo()

「変換コード」に従って、obj.foo() を

obj.foo.call(obj) に変換します

さて、これは obj です。終わり。

トピックに戻る:

var obj = { foo: function(){   console.log(this)
 }
}var bar = obj.foo

obj.foo() // obj.foo.call(obj) に変換、これは objbar() // bar.call() に変換 // コンテキストが渡されないため / / したがって、これは未定義です// 最後に、ブラウザはデフォルトの this - window object を与えます

[ ] 構文

function fn (){ console.log(this) }
var arr = [fn, fn2]
arr0 // 这里面的 this 又是什么呢？

arr0 を arr.0( ) として想像できますが、後者の構文は間違っていますが、形式は同じ変換コード内の obj.child.method(p1, p2) が対応しているので、問題なく変換できます:

arr0
arr.0()
と想像してarr.0.call(arr)に変換
するとこの内部は arr です:)

概要

これは、関数を呼び出すときに渡されるコンテキストです。
関数呼び出し形式が呼び出し形式でない場合は、「変換コード」に従って呼び出し形式に変換してください。

将来的には、これに関連するすべての筆記試験の問題について何の疑問も抱かなくなるでしょう。

この記事では、これに関連する説明を提供します。関連コンテンツの詳細については、php 中国語 Web サイトを参照してください。

関連する推奨事項:

数学、配列、Dat について

HTML5/CSS3 関連の知識の説明関連する例

Javascript 操作 DOM でよく使用される API のまとめ

以上がJavaScript でのこれの使用法の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。