JavaScriptの詳細な説明 thisキーワード

関数fn(){
 console.log(これを);
}
var obj = {fn:fn};
fn();//this->window
obj.fn();//this->obj
関数sum(){
 fn();//this->window
}
和（）;
var oo = {
 合計:関数(){
 console.log(this);//this->oo
 fn(); //this->window
 }
};
oo.sum();

(function(){ //this->window })();
 ~function(){ //this->window }();

oDiv.onclick=関数(){
 //this->oDiv
 };

oDiv.addEventListener("クリック",function(){
 //this->oDiv
 }、間違い）;

oDiv.attachEvent("クリック",function(){
 //this->ウィンドウ
 });

関数fn(){
 console.log(これを);
}
document.getElementById("div1").onclick=fn; //fn 内の this は #div1 です
document.getElementById("div1").onclick=関数(){
console.log(これ);//これ->#div1
fn();//this->window
};

関数 CreateJsPerson(名前,年齢){
//ブラウザによってデフォルトで作成されるオブジェクトはインスタンス p1->this です
this.name=名前;//->p1.name=名前
this.age=年齢;
this.writeJs = 関数() {
console.log("私の名前は"+this.name +"です。Js を書くことができます");
 };
//ブラウザはデフォルトで作成されたインスタンスを返します}
var p1=new CreateJsPerson("尹华芝",48);

関数Fn(){
this.x = 100; //this->f1
this.getX=関数(){
console.log(this.x); //this->getX がいつ実行されるか確認する必要がある}
}
var f1 = 新しい Fn;
f1.getX(); //-> メソッド内の this は f1 なので、f1.x=100
var ss=f1.getX;
ss(); //->メソッド内のthisはwindow->undefinedです

var obj={name:"波間のボート"};
関数fn(){
console.log(this);//this=>window
}
関数fn();
obj.fn(); //->Uncaught TypeError: obj.fn は関数ではありません

//非厳密モードの場合 var obj={name:"浪里行舟"};
関数 fn(num1,num2){
コンソールログ(数値1+数値2);
console.log(これを);
}
fn.call(100,200);//this->100 num1=200 num2=未定義
fn.call(obj,100,200);//this->obj num1=100 num2=200
fn.call();//this->window
fn.call(null);//this->window
fn.call(undefined);//this->window

// 厳密モードではfn.call(); // 厳密モードではthis->undefined
fn.call(null); // 厳密モードでは this->null
fn.call(undefined); // 厳密モードでは this->undefined

呼び出し元オブジェクトを 100,200 に設定します。
fn.apply(obj,[100,200]);

fn.bind(obj,1,2);//-> fn 内の this を obj に変更し、2 つのパラメータ値 1 と 2 を fn に渡します。
 しかし、この時点では fn 関数は実行されません var tempFn=fn.bind(obj,1,2);
tempFn(); //fn関数はこのように実行されます

var a = {
 名前：「チェリー」
 fn:関数(a,b){
 コンソールログ(a + b)
 }
 }
 var b = a.fn;
 b.bind(a,1,2)

b.bind(a,1,2)() //3

var obj = {
 生年月日: 1990年
 getAge: 関数 () {
 var b = this.birth; // 1990
 var fn = 関数() {
 return new Date().getFullYear() - this.birth; // this は window または undefined を参照します
 };
 fn() を返します。
 }
};

<button id="btn1">矢印関数 this_1 をテストする</button>
 <button id="btn2">矢印関数 this_2 をテストする</button>
 <script type="text/javascript"> 
 btn1 = document.getElementById('btn1'); とします。
 obj = {
 名前: 'kobe',
 年齢: 39歳
 getName: 関数 () {
 btn1.onclick = () => {
 console.log(これ);//obj
 };
 }
 };
 オブジェクト名を取得します。
 </スクリプト>

btn1 = document.getElementById('btn1'); とします。
 obj = {
 名前: 'kobe',
 年齢: 39歳
 getName: 関数 () {
 console.log(これ)
 }
 };
 オブジェクト名を取得します。

<button id="btn1">矢印関数 this_1 をテストする</button>
 <button id="btn2">矢印関数 this_2 をテストする</button>
 <script type="text/javascript"> 
 btn2 = document.getElementById('btn2'); とします。
 obj = {
 名前: 'kobe',
 年齢: 39歳
 取得名: () => {
 btn2.onclick = () => {
 console.log(this);//ウィンドウ
 };
 }
 };
 オブジェクト名を取得します。
 </スクリプト>

var obj = {
 生年月日: 1990年
 getAge: 関数 (年) {
 var b = this.birth; // 1990
 var fn = (y) => y - this.birth; // this.birth はまだ 1990 年です
 fn.call({birth:2000}, year); を返します。
 }
};
obj.getAge(2018); // 28