太想要放梗圖ㄌ.....

this = 這個。

如果對this的理解到這裡，很棒 您跟我一樣完全看不懂this呢！

接下來就從豬腦浸豬籠ㄉ角度來看 this是啥米吧...

關於 this的資訊會分成4-5篇用對我來說最簡單方式去理解＆介紹，分別是：

Day [1] — this：存在於物件 ＝ 主要講指向 instance（物件實體）

Day [2] — this：作用域 ＝ 主要講 this 和作用域的關係

Day [3] — this：建構物件 ＝ 主要講 this 和 new

Day [4] — this：指定物件 ＝ 主要講 this 和 .call() / .apply() / .bind()

Day [5] — this：可能總結一下還沒想好

What ‘s THIS ???

1. this 是 JavaScript裡的關鍵字。
2. this 是 執行函式時，自動生成的內部物件。
3. this 隨著執行的函式場合不同，會指向不同值。
4. 多數情況下，this 代表呼叫函式的物件。

Day [1] — this：存在於物件

當 this 在函數運行的時候自動指向 instance（物件實體） 的屬性。

這時候應該已經有人想說 instance（物件實體） 是啥了，
反正我還要寫30天，請期待一下後續的文章謝謝。

//來個範例吧！

var a = 123;

function jaygu() {
   console.log(this.a);
}
jaygu();  // 123

『 ㄟ？那我直接呼叫 a 不也一樣？幹嘛用this？』

客倌且慢，我們再往下看：

//來個範例吧！

function jaygu(){
	console.log(this.a);
}
//jaygu 函式會運行出 this.a的結果

var obj = {}; //這是一個空物件
obj.a = 123; //在空物件裡帶入 a = 123 這個值
obj.b = jaygu; //在空物件裡帶入 b = jaygu 這個函式

obj.b(); //當我們呼叫 obj.b 就印出 123 

//解析一下
//你知道這裡的 this 指向得是什麼了嗎？

//當我們呼叫 obj.b(); 的時候，
//會自動去找到 obj.b = jaygu; 這個函式，
//而這個函式會執行 console.log(this.a); ，
//this 就自動去指向在 var(全域變數) obj中的 a，
//而 obj.a = 123;，
//故最後 obj.b(); 會印出 123

//所以這裡的 this 指向的就是 obj 

等等，你說 "指向" ，所以... this不是一個固定的東西？

這樣說也對！簡單來說，在這個範例中 this 就是一個指向物件實體的功能。

來個複數物件的範例：

//來個範例吧！

var getName = function(){
  return pet1.petName;
};

var pet1 = {
  petName: "汪汪",
  getName: getName
};

var pet2 = {
  petName: "貓",
  getName: getName
};

console.log( pet1.getName() );
console.log( pet2.getName() );

//以上兩個例子都會回傳 "汪汪", 
//因為我們讓 getName = function(){ return pet1.petName;};

接著將 this 代入看看：

var getName = function(){
  return this.petName;
};

var pet1 = {
  petName: "汪汪",
  getName: getName
};

var pet2 = {
  petName: "貓",
  getName: getName
};

console.log( pet1.getName() ); 
//這裡會回傳 "汪汪"，因為 this 指向 pet1

console.log( pet2.getName() ); 
//這裡會回傳 "貓"，因為 this 指向 pet2

從這邊的範例我們可以很簡單的知道， this 會由於呼叫的物件不同，執行結果也不同。
在上面的範例中 this 就分別指向了 pet1 和 pet2。

回到最上面的問題：『 ㄟ？那我直接呼叫 a 不也一樣？幹嘛用this？』

記得在開頭我們提到 this 的中文就是 “這個” 嗎？

在上面的範例中，我們能將 這個(this) 視作一個代名詞，
意思就是指 我能用 這個(this) 指向我想表達的物件。

最後送上一張符合章節meme

希望大家看ㄌ歡喜 & 30Days後的我覺得自己很棒！d(`･∀･)b

也請各位前輩們不吝給予批評和指教，或4給我一點鼓勵 or meme 哇ㄟ揪歡喜！

引用及參考資訊

What's THIS in JavaScript ? [上]

淺談 JavaScript 頭號難題 this：絕對不完整，但保證好懂

this 的值到底是什么？一次说清楚

淺談 JavaScript 頭號難題 this：絕對不完整，但保證好懂

JavaScript深入之从ECMAScript规范解读this · Issue #7 · mqyqingfeng/Blog