js中的this

# 隱式綁定，this會根據調用時候的上下文，來判斷自身表明什麼！

function foo() {
	console.log( this.a );
}
var obj = {
	a: 2,
	foo: foo
};
obj.foo(); // 2
var foo2 = obj.foo;
foo2();//undefined

 #顯式綁定，call，apply

function foo() {
    console.log( this.a );
}
var obj = {
    a:2
};
foo.call( obj ); // 2

   讀代碼吧，通常函數默認回傳this和arguments，

function foo(something) {
console.log( this.a, something );
    return this.a + something;
}
// 簡單的輔助綁定函數
function bind(fn, obj) {
    return function() {//js函數的arguments 默認回傳的。
        return fn.apply( obj, arguments );
    };
}
var obj = {
    a:2
};
var bar = bind( foo, obj );
var b = bar( 3 ); // 2 3
console.log( b ); // 5

 暴力硬綁定。

function foo(something) {
console.log( this.a, something );
return this.a + something;
}

var obj = {
a:2
};
var bar = foo.bind( obj );
var b = bar( 3 ); // 2 3
console.log( b ); // 5

 #用New建立對象時的this

function foo(a) {
this.a = a;
}
var bar = new foo(2);
console.log( bar.a ); // 2

#區分如下2個this

function Plane(){
	this.drive = function (){
		console.log("I am plane");
	}
}
function Car() {
	console.log(this);//這個this是Car
	let plane = new Plane();
	let vehDrive = plane.drive;
	plane.drive = function() {
		vehDrive.call(this);//函數體裏的這個this表明調用者,plane,在#$%^處調用的
		console.log(
			"Rolling on all " + " wheels!"
		);
	}
	this.drive = function(){
		plane.drive();//#$%^
	}
}
var myCar= new Car();
myCar.drive();

 

#箭頭函數是個例外，他不是調用時候的上下文，而是等效於多了一個bind函數

function foo() {
    // 返回一個箭頭函數
    return (a) => {
        //this 繼承自foo()
        console.log( this.a );
    };
}
var obj1 = {
    a:2
};
var obj2 = {
    a:3
};
var bar = foo.call( obj1 );
bar.call( obj2 ); // 2, 不是3 ！