Class 属性给出了 no-undef

Question

我正在尝试在 ReactJS 中制作非组件 class。 我在 JavaScript 上关注的大多数教程都表明，当您制作 class 时，您只需使用this.[name]指定它们即可创建属性。

有些东西真的不喜欢这样，它给我的属性抛出了一个no-undef错误。

这是有问题的代码：

class MicroBitConnection {
    constructor(device) {
        this.device = device;

        this.connectDAP();
    }

    connectDAP() {
        this.transport = new DAPjs.WebUSB(device);
        this.dap       = new DAPjs.DAPLink(transport);
    }
}

现在我什至没有在任何地方实例化 class，它立即给了我这个错误：

Line 11:43:  'device' is not defined     no-undef
Line 12:44:  'transport' is not defined  no-undef

这似乎不是一个 linting 问题，因为即使在文件顶部使用/* eslint no-undef: 0 */ // --> OFF此警告，实际运行在某处实例化 class 的代码也会给出同样的错误：

Error: ReferenceError: device is not defined

Answer 1

在您的connectDAP方法中，您引用了未定义的变量device和transport 。 您可能希望使用在实例this上定义的属性：

class MicroBitConnection {
    constructor(device) {
        this.device = device;

        this.connectDAP();
    }

    connectDAP() {
        this.transport = new DAPjs.WebUSB(this.device);
        this.dap       = new DAPjs.DAPLink(this.transport);
    }
}

另请注意， this不会自动绑定到实例，例如当使用实例方法作为事件处理程序时。 要确保它在所有情况下都绑定到实例，请在构造函数中调用Function.prototype.bind ：

this.connectDAP = this.connectDAP.bind(this);

如果你想省略this ，你需要在本地声明变量，这可以很容易地使用解构来完成：

class MicroBitConnection {
    constructor(device) {
        this.device = device;

        this.connectDAP();
    }

    connectDAP() {
        const { device } = this;
        this.transport = new DAPjs.WebUSB(device);
        const { transport } = this;
        this.dap       = new DAPjs.DAPLink(transport);
    }
}

第三种选择（不推荐）是使用with语句：

class MicroBitConnection {
    constructor(device) {
        this.device = device;
        this.transport = null;
        this.dap = null;
        this.connectDAP();
    }

    connectDAP() {
        with (this) {
            transport = new DAPjs.WebUSB(device);
            dap       = new DAPjs.DAPLink(transport);
        }
    }
}

我不确定最后一个版本是否符合您的期望，只是为了完整起见将其列出并让您知道with语句的存在。