this到底指向什么地方,决定于函数的调用方式。app
一、 指向全局变量 --- 函数被单独调用的时候函数
function fn() { console.log( this.a ); } var a = 2; fn(); //2 fn单独调用,this引用window
二、 指向某对象 --- 隐式绑定
隐式调用的意思是,函数调用时拥有一个上下文对象this
function fn() { console.log( this.a ); } var obj = { a: 2, fn: fn }; obj.fn(); //2 this引用obj。 //说明的一点是,最后一个调用该函数的对象是传到函数的上下文对象。如: function fn() { console.log( this.a ); } var obj2 = { a: 42, fn: fn }; var obj1 = { a: 2, obj2: obj2 }; obj1.obj2.fn(); //42 this引用的是obj2. //还有一点要说明的是,失去隐式绑定的状况,以下: function fn() { console.log( this.a ); } var obj = { a: 2, fn: fn }; var bar = obj.fn; // 函数引用传递 var a = "全局"; // 定义全局变量 bar(); // "全局"
如上,虽然有隐式绑定,可是它执行的效果明显是把fn赋给bar。这样bar执行的时候,依然是函数单独调用,指向全局变量,因此输出结果如上。spa
三、 指向某对象 --- 显示绑定
经过call()、apply()、bind()。它们接收的第一个参数便是上下文对象,并将其赋给this。code
function fn() { console.log( this.a ); } var obj = { a: 2 }; fn.call( obj ); // 2
若是咱们传递第一个值为简单值,那么后台会自动转换为对应的封装对象。若是传递为null,那么结果就是在绑定默认全局变量。对象
四、 指向类实例
若是是一个构造函数,用new来调用,那么this指向新建立的对象。blog
function fn(a) { this.a = a; } var bar = new fn( 2 ); console.log( bar.a );// 2