ホームページ > 記事 > ウェブフロントエンド > JavaScriptの詳しい説明はこちら(グラフィックチュートリアル)
この記事では、JavaScript に関する関連情報を詳しく紹介します。
this の値は実行時に決定されます。プログラムが実行中であることは、状況に応じて次の状況に分類できます。
1. グローバル スコープの this グローバル スコープでは、this は window オブジェクトを指します。console.log(this);//指向window对象 this.x = 5//在全局作用域内创建一个x //与this.x = 5的等价情况: //var x = 5; //x = 5;グローバル スコープで var x=5 を実行すると、実際には window オブジェクトの属性 x が作成され、それが 5 に等しくなります。 変数を定義するときに var を追加しない場合、JS はその変数をグローバル変数とみなし、ウィンドウ オブジェクトのプロパティとして扱います。
2.関数内のこれ
JSには直接呼び出される関数を通常の関数と呼び、newを通してオブジェクトを作成する関数をコンストラクターと呼びます。
2.1 コンストラクター内の This コンストラクター内の This は、作成するオブジェクトを指します。次のようなものです。function Person(name){ this.name = name;//this指向该函数创建的对象person } var person = new Person("chaimm");2.2 通常の関数内の This 通常の関数内の This は、ウィンドウ オブジェクトを指します。
上記の例で Perosn 関数が直接実行される場合、これはウィンドウ オブジェクトを表すため、関数の実行後にグローバル名が作成されます。
function Person(name){ this.name = name;//this指向window } Person("chai");//当作普通函数执行,this指向window对象
3. オブジェクト内の this
オブジェクト内の this は、次のような現在のオブジェクトを指します。
var person = { name : "chaimm", getName : function(){ return this.name; } }上記のコードでは、this は関数 getName が属するオブジェクトを指します。 ただし、オブジェクトの関数内にネストされた関数がある場合、この関数の this はその外側のオブジェクトではなくウィンドウを指します。
var person = { name : "chaimm", setName : function(name){ (function(name){ this.name = name; //此时this并不代表person对象,而是代表window对象 })(name); } }上記の例では、person オブジェクトに getName 関数があり、その getName 関数内にある関数が、person オブジェクトではなく window オブジェクトを指しています。これは JS のバグです。通常、このバグを回避するには以下のような処理が行われます。
var person = { name : "chaimm", setName : function(name){ var thar = this;//将this赋给that (function(name){ that.name = name;//此时that指向person对象 })(name); } }personオブジェクトの第1レベルの関数で、これをローカル変数thatに代入し、それを第2レベルの関数で使用します。これは人物オブジェクトを指し、人物の属性を操作できます。 注: オブジェクト内の関数を変数に割り当て、その変数を通じてその関数を呼び出す場合、以下に示すように、関数内の this はオブジェクトではなくウィンドウを指します。
var person = { name : "chaimm", getName : function(){ return this.name; } } //将getName函数赋给一个新的变量 var newGetName = person.getName; //通过新的变量调用这个函数,这个函数中的this将指向window newGetName();//若全局作用域中没有name,则将返回undefined
4. 呼び出しを使用します。これら 2 つの関数は、呼び出された関数内の this が指すオブジェクトを手動で指定できます。
//定义一个构造函数 var Person = function(name){ this.name = ""; this.setName = function(name){ this.name = name; } } //创建两个对象 var personA = new Person("A"); var personB = new Person("B"); //使用personA的setName函数去修改personB的name属性 personA.setName.apply(personB,["C"]);
applyの使い方
オブジェクトA.関数名.apply(オブジェクトB,パラメータリスト);
オブジェクトBがapplyの最初のパラメータとして渡されると、オブジェクトAの関数内のthisはオブジェクトを指しますB、このとき、オブジェクト A に対するこの関数の操作はオブジェクト B に適用され、オブジェクト A を使用してオブジェクト B の関数を呼び出すことが実現されます。上記は私があなたのためにまとめたものです。
関連記事:JavaScript が何を指すのかについての詳細な紹介(写真と文章)
以上がJavaScriptの詳しい説明はこちら(グラフィックチュートリアル)の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。