JavaScript中this的用法及在不同场景下的指向解析

JavaScript中this的绑定机制

由于JavaScript采用运行期绑定的机制，this关键字的含义具有高度动态性。它可能指向全局对象、当前所属对象或任意指定对象，具体指向完全取决于函数被调用的具体方式。

在JavaScript中，函数的调用主要存在四种模式：作为普通函数直接调用、作为对象的方法调用、作为构造函数调用，以及通过apply或call方法调用。下文将依据这几种不同的调用模式，逐一分析this的具体指向。

普通函数调用时的this指向

第一种情况：普通函数调用

这是函数最基础的调用形式，属于全局层面的调用。在此模式下，this关键字默认绑定到全局对象Global上。

当函数被直接调用时，this会绑定到全局对象。

function makeNoSense(x) { 
  this.x = x; 
} 
makeNoSense(5); 
console.log(x);// x 已经成为一个值为 5 的全局变量
function test(){
　　this.x = 1;
　　alert(this.x);
}
test(); // 1

对象方法调用时的this指向

第二种情况：作为对象方法的调用

当函数被作为某个对象的方法进行调用时，this指向该对象内部，即调用该方法的对象本身。

var myObject = {
　　value :0,
　　increment:function (inc){
　　　　this.value += typeof inc ==='number' ? inc:1;
　　}
};
myObject.increment();
console.log(myObject.value); //1
myObject.increment(2);
console.log(myObject.value); //3

构造函数调用时的this指向

第三种情况：作为构造函数调用

JavaScript支持面向对象编程，但与主流面向对象语言不同，它没有类（class）的概念，而是采用基于原型（prototype）的继承机制。

因此，JavaScript中的构造函数具有特殊性。若不使用new关键字调用，其行为与普通函数无异。按照约定，构造函数名称首字母大写，以提示调用者使用正确方式。若正确使用new调用，this将绑定到新创建的对象实例上。

构造函数的作用是通过该函数生成一个新对象（object）。此时，this即指代这个新创建的对象。

function Point(x, y){ 
  this.x = x; 
  this.y = y; 
 }
var p1 = new Point(3,2);
console.log(p1.x+","+p1.y);//3,2

为了证明此时this并非指向全局对象，我们对代码进行如下调整：

var x = 4;
function Point(x, y){ 
  this.x = x; 
  this.y = y; 
 }
var p1 = new Point(3,2);
console.log(p1.x+","+p1.y);//3,2

apply与call方法对this的控制

第四种情况：通过apply或call调用

再次强调，在JavaScript中函数也是对象，而对象拥有方法。apply和call正是函数对象的方法，它们功能强大，允许切换函数执行的上下文环境（context），即改变this绑定的对象。许多JavaScript技巧及类库均依赖此方法。具体示例如下：

function Point(x, y){ 
  this.x = x; 
  this.y = y; 
  this.moveTo = function(x, y){ 
    this.x = x; 
    this.y = y; 
    console.log(this.x+","+this.y);
  } 
} 
var p1 = new Point(0, 0); 
var p2 = {x: 0, y: 0}; 
p1.moveTo(1, 1); //1,1
p1.moveTo.apply(p2, [10, 10]);//10,10

在上述示例中，我们利用构造函数创建了一个对象p1，该对象拥有moveTo方法；同时使用对象字面量创建了另一个对象p2。可以看到，使用apply可以将p1的方法应用于p2，此时this被绑定到对象p2上。call方法具备相同功能，区别在于其参数不是以数组形式统一传入，而是逐个分开传入。本文通过讲解JavaScript中易混淆的this在四种应用场景下的使用方法，希望能对您有所帮助。

以上介绍了JavaScript中this的用法及其在不同应用场景中的作用，希望对大家有所帮助。如有任何疑问，欢迎留言，小编会及时回复。感谢大家对本站的支持！