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

Question

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

---

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

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

3. Touch.js ：从Event.js识别event ID，然后将其记录。

---

一个问题是Touch.js的构造函数Touch.js不起作用。 浏览器无法访问它。 当我尝试将其记录为A和B的局部变量时，它始终保持undefined状态。

我发现的唯一可能的方法是从Init.js创建变量，将它们传递给Event.js ，然后再次传递给Touch.js就像我在下面所做的那样。

有什么方法可以使用其自己的构造函数的局部变量？

请参见下面的代码：

//============== 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);