如何在Node.js中使用第二个构造函数的变量？ （使用导入/导出）

Question

我有3个不同的.js文件，它们通过import/export关键字链接在一起。每个文件都有自己的特定功能，如下所示：

---

1. Init.js：调用Event.js和Touch.js。将变量发送到 Event.js。

2. Event.js：从Init.js接收变量并注册 event到每个元素。

3. Touch.js：从event识别Event.js id，然后记录它。

---

一个问题是Touch.js的构造函数根本不起作用。浏览器无法访问它。当我尝试记录undefined和A的局部变量时，它会不断触发B。

我发现的唯一可能的方法是从Init.js创建变量，将它们传递给Event.js，然后再次传递给Touch.js，如下所示。 / p>

有没有办法使用其自己的构造函数的局部变量？

请参见下面的代码：

//============== Init.js ==============
'use strict';
import {Event} from './event.js';
import { proTouch } from './touch.js';
const slider = (function() {
    class Slider {
        constructor(elem) {
            this.elem = document.querySelectorAll(elem);
            this.C = false;
            this.Event = new Event();
            this.Event.register(this.elem, 'mouseenter', proTouch.start, this.C);
        }
    }
    return {
        initialize: new Slider('.box')
    }
}());

//============== Event.js ==============

export class Event {
    constructor() {

    }
    register(node, eventName, callback, flag) {
        let bind = callback.bind(this);
        node.forEach(cur => {
            cur.addEventListener(eventName, (e) => bind(e, flag))
        })
    }
}


//============== Touch.js ==============

class Touch {
    constructor() {
        this.A = false;
        this.B = true; // <-- I want to use this constructor function.
    }
    start(e, flag) {
        console.log(e.type, this.A, this.B, flag); // <-- this.A and this.B fire undefined.
    }
}
const proTouch = new Touch();
export { proTouch }

Answer 1

在您的Event类中，您将回调绑定到this。这是错误的，因为在这种情况下，this是Event实例，并且不包含a或b变量。删除该行。

let bind = callback.bind(this);//Wrong. Delete this line.

发送回调时，您要将proTouch绑定到start方法。因此，绑定在那里。

this.Event.register(this.elem, 'mouseenter', proTouch.start.bind(proTouch), this.C);