JavaScriptでthisの指向をどのように決定しますか?

12736 ワード

JavaScript

文書ディレクトリ

まず

厳格モード

thisキーワード

グローバルコンテキスト(関数外)

関数コンテキスト(関数内)

まず

JSには変数昇格が存在し、実際に昇格したのは

を初期化するのではなく宣言である.

はJava反射におけるmethod.invoke(obj)とは異なり、Javaは実行時にコマンドinvokedynamicを用いて動的解析を行い、静的解析と同様にobjに対応するクラスがmethodを持っているか否かを判断し、そうでなければ異常を報告する.JavaScriptの1つの関数は独立して実行することも、任意のオブジェクトにバインドして実行することもできます.これは、JSの関数がメモリに単独で保存され、関数のアドレスが返され、アドレスが任意のオブジェクトの属性にバインドされる

であるからです.
厳格モード
Javascript構文のいくつかの不合理で厳格でない点を解消し、いくつかの奇妙な行為を減らし、コンパイル効率と実行速度を高めるために、政府はコードの前に「use strict」を宣言することによって明示的に開き、またはを同時にサポートする厳格なモードを提案した.

グローバル

 "use strict"
 myFunction();

ローカル

 function myFunction() {
       "use strict";
        y = 3.14;   //    (y    )
}

厳格なモードでは多くの制限がありますが、thisの指向にはいくつかの特性に関心を持つ必要があります.

非厳格モードでは、グローバルオブジェクトはnode:global、browser:windowであり、厳格モードでは、グローバルオブジェクトはundefinedである.

厳格モードでは、宣言されていない変数は使用できません(変数の昇格に影響しません).

delete操作では、グローバルオブジェクトがundefinedであるため、オブジェクトと関数を含むグローバル変数を削除できません.
このキーワード
JSにおけるthisキーワードの動作は,他の言語とは異なり,自身も （use strict）とで異なる.
グローバルコンテキスト(関数外)

は、厳格モードであるかどうかにかかわらず、グローバルオブジェクトを指します. : undifined

関数コンテキスト(関数内)

デフォルトでは、関数の呼び出しオブジェクトを指し、最も直接的な呼び出しオブジェクトです.

単純呼び出し、グローバルオブジェクト : undifined， windowへ

単純コール

var o = {
 	prop: 37,
 	f: function() {
      return this.prop;
 	}
};
var f = o.f;
console.log(f()); // undefined

単純コール二

 function func(){
   return this;
 }
 console.log(func()); // [object Window]

単純呼び出し三

var o = {
 prop: 37,
 f: function() {
    return func();
 }
};
function func(){
  return this;
}
console.log(o.f()); // [object Window]

は、オブジェクト自体の属性として呼び出される.

関数を属性として新しいオブジェクトに渡し、呼び出す.

プロトタイプチェーン継承関数呼び出し;

Getter、Setter呼び出し;

Function.prototype.call(this,...args)、Function.prototype.apply(this,[arg0,arg1...])呼び出しオブジェクトを指定します.

Function.prototype.bind(this,...args)バインド、bind()メソッドは新しい関数を作成し、生成された新しい関数はその後のすべてのbind()を無視し、thisはbindメソッドの最初のパラメータによって永久にバインドされ、 ;

矢印関数は、独自のthisバインドがなく、閉じた語彙コンテキストのthis値、を保持し、その後は次のいずれかです.

関数を属性として新しいオブジェクトに渡し、呼び出し、

call、apply呼び出しオブジェクトを直接指定する

かbindか

か
いずれもthisを変更することはありません(注意:call,bind,or apply、呼び出しパラメータを渡すことができ、最初のパラメータをnullに設定することができます).

関数は、構築中の新しいオブジェクトを指す構築方法(newキーワードを使用)として使用されます.注:デフォルトでは、コンストラクションメソッドはthisを返しますが、return戻り値で変更できますが、戻り値がオブジェクト(e.g 1、test)でない場合はthisを返します.

Domイベント処理関数として、thisはイベントをトリガするDom要素オブジェクトを指す:

document.querySelector("#id").addEventListener("click",function(){ alert(this); }); //HTTPElement
document.querySelector("#id").onclick = function(){  alert(this); }; //HTTPElement

行内on-event処理関数として、thisはDom要素オブジェクトを指します.実際、このthisは eventと同様に、決定された値をJavaScriptスクリプトに直接渡します.

<button onclick="alert(this.tagName.toLowerCase());">
   Show this
button>
<button onclick="document.getElementById('demo').innerHTML=this;">
   Show this
button>

は特殊であり、関数が別の関数で呼び出されると、上記のすべての規則を遵守する.次のすべての場合、最終的には単純呼び出しであり、グローバルオブジェクト、 undefinedを指す.

document.querySelector("#id").addEventListener("click",function(){ alert(test()); }); //[object Window]
function test(){ 
   return this
}

<button onclick="alert(test());">
 Show this
button>
<button onclick="alert((function() { return this; })());">
 Show this
button>

qmake紹介

JavaはFTPの簡単な機能を実現して、socks 4エージェントの簡単な例を着ます