首页 > 解决方案 > 默认导出类的新实例

问题描述

下面的代码片段会在每次导入时生成新实例吗?

// 1st implementation

class ConnectionManager {
...
}

export default new ConnectionManager();
// 2nd implementation

class ConnectionManager {
...
}

const connectionManager = new ConnectionManager();
export default connectionManager;

如果是,我怎样才能在每次导入中获得相同的实例?

标签: javascriptes6-modules

解决方案


应该是一样的。

下面的示例使用这两种实现,将它们导入到 2 个不同的文件中,并将它们全部导入到单个index文件中。每次创建实例时,我们都会value为该类生成一个随机数,并记录它的创建。

// ConnectionManagerImpl1.ts
class ConnectionManagerImpl1 {
    public value;

    constructor() {
        this.value = Math.random().toString(36).substring(7);
        console.log(`New ConnectionManagerImpl1 instance created: ${this.value}`)
    }
}

export default new ConnectionManagerImpl1();

// ConnectionManagerImpl2.ts
class ConnectionManagerImpl2 {
    public value;

    constructor() {
        this.value = Math.random().toString(36).substring(7);
        console.log(`New ConnectionManagerImpl2 instance created: ${this.value}`)
    }
}

const connectionManagerImpl2 = new ConnectionManagerImpl2();
export default connectionManagerImpl2;

// import1.ts
import connectionManagerImpl1 from './ConnectionManagerImpl1';
import connectionManagerImpl2 from './ConnectionManagerImpl2';

export { connectionManagerImpl1, connectionManagerImpl2 };

// import2.ts
import connectionManagerImpl1 from './ConnectionManagerImpl1';
import connectionManagerImpl2 from './ConnectionManagerImpl2';

export { connectionManagerImpl1, connectionManagerImpl2 };

// index.ts
import * as import1 from './import1';
import * as import2 from './import2';

console.log(import1)
console.log(import2)
console.log("Done")

运行上述设置使用tsc --module 'commonjs' * && node index.js

输出:

New ConnectionManagerImpl1 instance created: ddt3re
New ConnectionManagerImpl2 instance created: uv5z6
{ connectionManagerImpl1: ConnectionManagerImpl1 { value: 'ddt3re' },
  connectionManagerImpl2: ConnectionManagerImpl2 { value: 'uv5z6' } }
{ connectionManagerImpl1: ConnectionManagerImpl1 { value: 'ddt3re' },
  connectionManagerImpl2: ConnectionManagerImpl2 { value: 'uv5z6' } }
Done

如您所见,只创建了 1 个ConnectionManagerImpl1ConnectionManagerImpl2的实例。因此,两个实现都应该只创建 1 个实例。


推荐阅读