JavaScript: 如何引用 Class 的 top/root？

Question

所以我遇到了这个问题：

class ClassName {
    constructor(value) {
        this.value = value;
    }
    someObject = {
        someFunction() {
            console.log(this.value);
        }
    }
}

someFunction() 的 this.value 没有引用构造函数中定义的值，这是因为 someFunction() 是 someObject 对象的一部分，并且 this引用对象。 那么我如何在它的 Objects/Properties 中引用 Class 的 top/root 来访问那里的值和属性？ 我还可以使用每个函数处于顶层，但将它们分组更清晰。

Answer 1

您可以使用 arrow-function 以免创建新范围：

class ClassName {
  constructor(value) { this.value = value; }
  someObject = {
    someFunction: () => { console.log(this.value); }
  }
}

const obj = new ClassName(1);

obj.someObject.someFunction();

如果要使用正常功能，需要使用bind:

class ClassName {
  constructor(value) { this.value = value; }
  someObject = {
    someFunction() { console.log(this.value); }
  }
}

const obj = new ClassName(1);

const fn = obj.someObject.someFunction.bind(obj);

fn();

Answer 2

把函数写成arrow function like this to bind this at declaration time. As you can see in the example below, this syntax implies that someObject is being instantiated once per object instance, so you're not leveraging JavaScript's prototypal inheritance就可以了，在内存消耗方面不太好

class ClassName {
    constructor(value) {
        this.value = value;
    }
    someObject = {
        someFunction: () => console.log(this.value)
    }
}

const obj = new ClassName('test');

obj.someObject.someFunction();

const obj2 = new ClassName;

console.log(obj2.someObject === obj.someObject); // false

JavaScript: 如何引用 Class 的 top/root？

JavaScript: How to reference the top/root of a Class?

javascript

class

reference

this