javascript - 为什么在定义了从对象到变量上下文的某些方法后丢失了？

Question

请帮助获得答案我不明白为什么定义后上下文丢失了

    class A {
    	func() {
    		console.log(this)
    	}
    }
    
    let a = new A();
    let b = a.func;
    b();

Answer 1

你可以参考这个来澄清你的疑问。

如果你在对象上调用一个函数，那么就这么简单 javascript 将该对象视为它的 this/context。

例如。

let obj = {
   key : 'value',
   fun : function(){

   }
}
// if called like obj.fun() --> obj is going to be this
// if called like let ffun = obj.fun; ffun();  ---> window/global object is going to be this

如果您使用 call/apply/bind 调用该方法，则需要将自定义上下文指定为这些方法的第一个参数。

//if call like obj.fun.call(someObject, p1, p2)
// Or obj.fun.apply(someObject, [p1, p2])
// Or let ffun = obj.fun.bind(someObject, [p1, p2]);   ffun();
// someObject is going to be this in all these 3 cases

在直接调用函数的其他情况下，它将窗口/全局对象作为其上下文。

Answer 2

正如@junvar 在评论中所说，您应该将函数绑定到this. 例如，您可以在构造函数中进行：

    class A {
        constructor(){
           this.func = this.func.bind(this)
        }
    	func() {
    		console.log(this)
    	}
    }
    
    let a = new A();
    let b = a.func;
    b();