JavaScript和TypeScript下的this关键字

背景

在js或者ts使用过程中，在方法中使用了this的时候，一个不小心就可能因其引起莫名其妙的错误。这通常是this所指向的上下文不是我们所期望的上下文引起的。

规则

在一个方法中（如果是ts，这里仅限于非lambda表达式定义的方法）有使用this关键字，那么可以按照下面的优先级顺序来推断this指向的是什么：

如果这个函数是function#bind调用的结果，那么this指向的是传入bind的参数
如果函数是以foo.func()形式调用的，那么this值为foo
如果是在严格模式下，this将为undefined
否则，this将是全局对象（浏览器环境里为window）

验证

var x = {
    name: "x",
    sayHello: function () {
        console.log("_" + this.name);
    }
};

x.sayHello();//_x;
var say = x.sayHello;
say();//非严格模式_,严格模式抛出异常Cannot read property 'name' of undefined
var name = "y";
say();//非严格模式_y
var z={
    name:"z",
    say:x.sayHello
}
z.say();//_z
say.bind(z)();//_z

TS中lambda表达式中的this

看下面的代码

class Foo {
  name = "z";
  x = {
    name: "x",
    sayHello: () => {
      let y = {
        name: "y",
        sayHello: () => {
          console.log("hello,I'm " + this.name);
        }
      }
      y.sayHello();
    }
  };
  sayHello(){
    this.x.sayHello();
  }
}
let  foo=new Foo();
foo.sayHello();//z
var t={
   name:"t",
   x:foo.x
}
foo.sayHello.bind(t)();//z
Foo.prototype.sayHello.bind(t)();//z

全部都输出z,说明了再TS中，如果方法是lambda表达式定义的，那么其中的this关键字总是指向类实例，而不在乎其引用链是怎样的，这实际上。实际上，如果方法是静态的，this会指向类本身。
foo.sayHello.bind(t)()和Foo.prototype.sayHello.bind(t)()的方式也没能改变this的指向，其实这是因为t.x指向了foo.x,而foo.x.sayHello()中的this指向foo的。
如果我们做下面的修改，就会发现了不一样了。

let foo2=new Foo();
foo2.name="t";
foo.sayHello.bind(foo2)();//t
Foo.prototype.sayHello.bind(foo2)();//t