Js 中的 this

Js 中 this 的理解

 

this 是啥 ？

 

this是 JavaScript 语言的一个关键字，它代表函数运行时，自动生成的一个内部对象，只能在函数内部使用; 随着函数使用场合的不同，this的值会发生变化。但是有一个总的原则，那就是this指的是调用函数的那个对象。

先搞明白一个很重要的概念 —— this的值是在执行的时候才能确认，定义的时候不能确认！为什么呢 —— 因为this是执行上下文环境的一部分，而执行上下文需要在代码执行之前确定，而不是定义的时候。查看执行上下文

 

我的理解：this 总是指向类的当前实例，this不能赋值；也就是说 this 不能脱离 类/对象 ，总结下来，this的指向大致分为4种情况

 

1.纯粹的函数调用，this指向全局对象window.

var x = 1;
function test() {
   console.log(this.x);
}
test();  // 1

2.严格模式下"use strict"，指向 undefined.

"use strict";
var x = 1;
function test() {
   console.log(this.x);
}
test();  // undefined

3.对象的方法里调用，this指向调用该方法的对象

function test() {
  console.log(this.x);
}
var obj = {};
obj.x = 1;
obj.m = test;

obj.m(); // 1

4.构造函数里的this，指向创建出来的实例，这里的 全局 x 始终是 1 ；说明了 this 指向构造函数创建的实例。

var x = 1;
function test() {
　this.x = 2;
}
var obj = new test();
obj.x // 2
x //1

 

那么this的指向能不能更改呢 ？

答案是当然可以的，call / apply / bind ；我们都知道call apply bind都可以改变函数调用this的指向。

call跟apply的用法几乎一样，唯一的不同就是传递的参数不同，call只能一个参数一个参数的传入。

apply则只支持传入一个数组，哪怕是一个参数也要是数组形式。最终调用函数时候这个数组会拆成一个个参数分别传入。

我的理解：a.call(b,arg1,arg2..) 就是a对象的方法应用到b对象上 ; 调用call的对象必须是一个函数对象,因为 call这个方法是在Function的prototype里的，因此 a 对象的共有属性也会应用到 b 对象上；(所谓的继承，apply同理)。我们实践一下：

 

实践一下 call / apply：

var x = 0;
function test() {
　console.log(this.x);
}
var obj = {};
obj.x = 1;
obj.m = test;
//apply 的方式
obj.m.apply()  // 0
obj.m.apply(obj);  //1
//call 的方式
obj.m.call()  // 0
obj.m.call(obj);  //1

至于bind方法，他是直接改变这个函数的this指向并且返回一个新的函数，之后再次调用这个函数的时候this都是指向bind绑定的第一个参数。

使用：fun.bind(thisFun);

var a = {
    b: function() {
      var func = function() {
        console.log(this.c);
      }
      func.bind(this)();
    },
    c: 'hello'
  }
  a.b(); // hello
  console.log(a.c); // hello