https://www.cnblogs.com/pssp/p/5216085.html
jsでこれのポイントを完全に理解し、それを一生懸命覚える必要はありません。
まず第一に、関数が定義されているとき、これのポイントは決定できないと言わなければなりません。関数が実行されたときだけ、これが誰を指しているのかを決定できます。実際、これの最後のポイントは、呼び出すオブジェクトです。それ(これらの質問のいくつかは、なぜ問題があるのかを後で説明します。インターネット上のほとんどの記事は、多くの場合、そのように理解することは問題を引き起こさないが、それを理解することは実際には不正確であると述べていますちなみに、ご理解いただけるとわかりにくい時期になります))、この問題について詳しくお話しします。
なぜこれを研究するのですか?オブジェクト指向プログラミングを学んだ場合は、それが何のためにあるのかを知っている必要があります。学んでいない場合は、当面はこの記事を読む必要はありません。もちろん、そうであれば読むことができます。結局のところ、これはjsで習得しなければならないことです。
例1:
function a(){ var user = "追梦子"; console.log(this.user); //未定義の console.log(this); //ウィンドウ } a();
上で述べたことによると、これは最終的にそれを呼び出すオブジェクトを指します。ここの関数は実際にはWindowオブジェクトによって示されます。次のコードはそれを証明できます。
function a(){ var user = "追梦子"; console.log(this.user); //未定義の console.log(this); //ウィンドウ } window.a();
上記のコードと同じように、実際には、アラートもウィンドウの属性であり、ウィンドウによってクリックアウトされます。
例2:
var o = { user: " 夢を追いかける"、 fn:function(){ console.log(this.user); // 夢を追いかける } } o.fn();
ここで、これはオブジェクトoを指します。これは、o.fn()の実行を通じてこのfnを呼び出すため、自然なポイントはオブジェクトoです。ここでも、関数の作成時にこのポイントは決定されません。電話をかけるとき、そして電話をかけた人は誰にでも向けられます。これは理解されなければなりません。
実際、例1と例2は十分に正確ではありません。次の例は、上記の理論を覆す可能性があります。
これを完全に理解したい場合は、次のいくつかの例を見る必要があります
この記事の出典:チャイ孟子ブログ
例3:
var o = { user: "chasing dreams "、 fn:function(){ console.log(this.user); // chasing dreams } } window.o.fn();
このコードは上記のコードとほぼ同じですが、なぜここでウィンドウを指していないのですか?上記の理論によれば、最終的にこれはそれを呼び出すオブジェクトを指しています。最初にそれについて話しましょう。ウィンドウはjs。グローバルオブジェクトで作成した変数は、実際にはウィンドウに属性を追加するためのものであるため、ここではウィンドウオブジェクトを使用できます。
上記のコードがウィンドウを指していない理由については説明しません。コードを見てみましょう。
var o = { a:10、 b:{ a:12、 fn:function(){ console.log(this.a); // 12 } } } obfn();
ここにもオブジェクトoのポイントがありますが、これはそれを実行しません。それなら、最初に言ったことはすべて間違っているわけではないと間違いなく言うでしょう。実はそうではありません。最初は正確ではありません。次に文章を追加します。この点はご理解いただけると思います。
ケース1:これが関数にあるが、上位レベルのオブジェクトによって呼び出されていない場合、これはウィンドウを指します。ここで説明する必要があるのは、厳密なバージョンのjsでは、これはウィンドウではないことを指しているということです。ただし、問題の厳密なバージョンについては説明していません。知りたい場合は、インターネットで見つけることができます。
ケース2:これが関数にあり、この関数が上位レベルのオブジェクトによって呼び出された場合、これは上位レベルのオブジェクトを指します。
ケース3:関数にこれがある場合、この関数には複数のオブジェクトが含まれます。この関数は最も外側のオブジェクトによって呼び出されますが、これは上位レベルのオブジェクトのみを指します。例3は、信じない場合は続行することを証明できます。いくつかの例を見てみましょう。
var o = { a:10、 b:{ // a:12、 fn:function(){ console.log(this.a); //未定義 } } } obfn();
オブジェクトbには属性aはありませんが、これはオブジェクトbを指します。これは、このオブジェクトに必要なものがあるかどうかに関係なく、親オブジェクトのみを指すためです。
別の特殊なケース、例4があります。
var o = { a:10、 b:{ a:12、 fn:function(){ console.log(this.a); //未定義の console.log(this); //ウィンドウ } } } var j = obfn; j();
ここでこれはウィンドウを指していますが、少し混乱していますか?実際、それはあなたが文章を理解していなかったからです。それもまた非常に重要です。
これは常に、最後に呼び出したオブジェクト、つまり実行時に呼び出したオブジェクトを指します。例4では、関数fnはオブジェクトbによって参照されていますが、変数jに割り当てられている場合は実行されません。最後のポイントはウィンドウです。これは、fnを直接実行する例3とは異なります。
これは実際には同じことですが、状況によって少し異なります。上記の要約には、場所ごとに小さなエラーがいくつかあり、エラーとは言えません。状況が異なるだけです。違いがありますので、一気にわかりやすく説明することはできません。ゆっくりと理解できるのはあなただけです。
コンストラクターバージョンthis:
function Fn(){ this.user = "Chasing Mengzi"; } var a = new Fn(); console.log(a.user); // Chasing Mengzi
オブジェクトaが関数Fnでユーザーを指し示すことができる理由は、新しいキーワードがこれのポイントを変更し、これをオブジェクトaに向けることができるためです。なぜaがオブジェクトであると言うのですか?新しいキーワードはオブジェクトインスタンスを作成します。この文を理解するために、例3について考えてみます。ここでは、変数aを使用してFnのインスタンスを作成します(Fnのコピーをオブジェクトaにコピーするのと同じです)。現時点では、作成されるのは、ただし、実行されず、これは呼び出されます。関数Fnはオブジェクトaであるため、これは当然オブジェクトaです。したがって、Fn関数のコピーをオブジェクトaにコピーしたので、なぜオブジェクトaにユーザーがいるのでしょうか。 newキーワードを使用することは、コピーをコピーすることと同じです。
上記に加えて、これの方向を自分で変更することもできます。これの方向を自分で変更する方法については、JavaScriptの呼び出し、適用、およびバインドのメソッドの概要を参照してください。この記事では、その方法について詳しく説明します。これの方向を手動で変更できます。
これがリターンに遭遇したときに小さな問題を更新します
function fn() { this.user = '追梦子'; {}を返す; } var a = new fn; console.log(a.user); //未定義
もう1つ見てください
function fn() { this.user = '追梦子'; function(){}を返す; } var a = new fn; console.log(a.user); //未定義
また来てね
function fn() { this.user = '夢を追いかける'; return 1; } var a = new fn; console.log(a.user); //夢を追いかける
function fn() { this.user = '夢を追いかける'; 未定義を返す; } var a = new fn; console.log(a.user); //夢を追いかける
どういう意味ですか?
戻り値がオブジェクトの場合、これは返されたオブジェクトを指します。戻り値がオブジェクトでない場合、これは関数のインスタンスを指します。
function fn() { this.user = '追梦子'; 未定義を返します。 } var a = new fn; console.log(a); // fn {user: "追梦子"}
もう1つのポイントは、nullもオブジェクトですが、nullは特殊であるため、ここでもその関数のインスタンスを指しているということです。
function fn() { this.user = '夢を追いかける'; nullを返す; } var a = new fn; console.log(a.user); //夢を追いかける
知識ポイントの補足:
1.厳密なバージョンでのデフォルトのthisはウィンドウではなくなりましたが、未定義です。
2.新しいオペレーターが機能の方向を変えます。これは上で説明しましたが、この問題については詳しく説明しておらず、インターネットではめったに言われないので、ここで説明する必要があります。
関数fn(){ this.num = 1; } var a = new fn(); console.log(a.num); // 1
なぜこれがを指しているのですか?最初に、newキーワードは空のオブジェクトを作成し、次に関数applyメソッドを自動的に呼び出して、これをこの空のオブジェクトにポイントします。これにより、関数内のthisがこの空のオブジェクトに置き換えられます。
2017-09-15 11:49:14
注:空のオブジェクトを新しく作成する場合、jsの内部実装では、必ずしもapplyメソッドを使用してこのポイントを変更する必要はありません。ここでは、例えを示します。
if(this === dynamic \ changeable)はtrueを返します。