如何设置JavaScript命名空间？封装类时遇语法错误求解

你代码里的错误在于：不能直接在对象字面量中声明class。JavaScript的对象字面量要求每个成员都是键: 值的形式，直接写class Foo{...}不符合对象字面量的语法规则，所以触发了语法错误。

方式一：先声明类，再挂载到命名空间 #

先单独定义类，再把类作为属性赋值给monitor对象，这是最直观的写法：

// 先定义类
class Foo{
    constructor(element_id, options){
        // some code
    }

    init = () => {
        // some code
    }

    some_function = (data) => {
        // some code
    }
}

class Bar{
    // some code
}

// 封装到命名空间对象
var monitor = {
    Foo: Foo,
    Bar: Bar
};

// 使用示例
const foo = new monitor.Foo('test-id', {});
foo.init();

方式二：在对象字面量中使用类表达式 #

把类直接作为对象属性的值（类表达式写法），不需要提前单独声明：

var monitor = {
    Foo: class {
        constructor(element_id, options){
            // some code
        }

        init = () => {
            // some code
        }

        some_function = (data) => {
            // some code
        }
    },
    Bar: class {
        // some code
    }
};

// 使用示例
const bar = new monitor.Bar();

方式三：用ES6模块作为命名空间（推荐现代项目使用） #

如果你的项目支持ES6模块，可以直接把类放在模块里，通过export导出，然后用import * as把整个模块作为命名空间引入：

// monitor.js 文件
export class Foo {
    constructor(element_id, options){
        // some code
    }

    init = () => {
        // some code
    }

    some_function = (data) => {
        // some code
    }
}

export class Bar {
    // some code
}

在需要使用的文件中：

import * as monitor from './monitor.js';

const fooInstance = new monitor.Foo('my-element', {});
fooInstance.some_function({});

注意：你代码里的init = () => {...}这种类字段语法是ES6+的特性，需要确保运行环境支持（比如现代浏览器、Node.js 12+），如果要兼容旧环境，可能需要用Babel转译。

内容的提问来源于stack exchange，提问作者mHelpMe