浅谈JavaScript 中的this

JavaScript 中的this

1.this是什么？

​ 函数调用的时候会创建上下文，this 是组成上下文的一部分。因此每次函数被调用都会产生新的this，既this的值就是调用当前函数的对象。

2.作为普通函数在全局作用域中被使用

​ 在全局作用域当中，this 永远指向 window，因此在全局作用域里作为普通函数被调用的时候，this 也是指向 window。

function fn1() {
    console.log(this); //window 
}

fn1();

3. 作为构造函数被调用，由new调用

作为构造函数被调用的时候，this 代表它即将 new 出来的未来的对象。

  function Fn1(oval) {
        this.val = oval;
        console.log(this);  //Fn1 {val: "vvv"}
    }

    var val = new Fn1('vvv');
    console.log(val.val)//vvv

4. 由call/apply/bind 方法调用

作为 call/apply/bind 方法被调用的时候指向传入的值

var obj = {

  name: 'zhangsan'

};

function fn1() {

  console.log(this); // {name: "zhangsan"}

  console.log(this.name); //zhangsan

}
fn1.apply(obj);

5. 箭头函数

箭头函数本身没有this，箭头函数中的this始终指向外部对象，且不能使用call/apply/bind改变this指向也不能进行实例化。

var obj = {
  name: 'zhangsan',
  sayhello: function() {
    var fn = () => {
        console.log(this);  // {name: "zhangsan"}
        console.log(this.name); //zhangsan
   }
   fn();
  }
}
obj.sayhello();

6.补充

this在严格模式下绑定到 undefined，否则绑定到全局对象。