// this的應用  “是”  代名詞
// this必須出現在函式裡面

//------------------預設繫結

function test (){
	console.log(this.a);//1
}

var a = 1;
test();

// this取得是window的物件a；此處預設window

//---------------------隱士繫結？

function test (){
	console.log(this.a);//2
}

var foo = {
	a:2,
	f:test
}
var a = 1;
foo.f();

//此處this取得是foo物件的a；

//---------------------隱士繫結 多層呼叫鏈？

function test (){
	console.log(this.a);//3
}

var foo = {
	a:3,
	f:test
}

var foo2 = {
	a:4,
	f:foo
}


var a = 1;
foo2.f.f();

//此處this取得是foo物件的a，foo2中只起到呼叫foo,所以thisl指的還是foo；

//---------------------隱士繫結 (隱士丟失) 多層呼叫鏈？

function test (){
	console.log(this.a);//1
}

var foo = {
	a:2,
	f:test
}
var a = 1;
var fun = foo.f;
fun();
 

//由於是賦值  呼叫的是fun(),foo.f 是取函式，但是this的物件是fun，是window物件，所以只能取得全域性變數a

//1，this所在的函式是事件處理函式，那麼this就是事件源；

var btns = document.getElementsByTagName("button");
獲取所有button
for(var i = 0; i < btns.length;i++){
	btns[i].onclick = function(){
		this代表當前事件源
		console.log(this)
	}
}

// 2、this所在函式是建構函式，那麼this就是new的物件,並且會生成__proto__屬性。

function func(name,age){
	this.name = name;
	this.age = age;
	// console.log(this)
}

let f = new func("z",20);

// 3、this所在函式是類的方法，那麼this就是呼叫方法時的物件

function Fnc(name,age){
	this.name = name;
	this.age = age;
}
Fnc.prototype.eat = function(){
	console.log(this);
}
let fn = new Fnc("a",12);
fn.eat();
let fn2 = new Fnc("b",10);
fn2.eat();

// 4、this的轉移  轉移到window

var btns = document.getElementsByTagName("button");
//獲取所有button
for(let i = 0; i < btns.length;i++){
	btns[i].onclick = function(){
		console.log(this)
		// this代表點選事件源
		setTimeout(function(){
			console.log(this);
			// this代表window物件 發生了轉移
		},30)
	}
}

/*
以上所說的所在函式，重點看關鍵字function。不會受箭頭函式的影響

JavaScript中的一切的一切都屬於window物件。window物件可以省略。
所有的全部變數，函式，類，都屬於window物件。

this的轉移：發生在閉包裡。*/