JavaScript类方法返回Set/MAP时控制台显示异常原因咨询

先看你的代码：

class a {
    public COUNTS = new Set<string>();

    constructor() {
    }

    public execute(): any {
        this.COUNTS.add('a');
        this.COUNTS.add('b');

        console.log(this.COUNTS);
        return { contas: this.COUNTS };
    }
}

const x = (new a()).execute();
console.log(x);

出现这种差异的核心原因是浏览器/Node.js的控制台对不同类型的处理逻辑不一样：

• 当直接打印Set/Map实例时，控制台有专门的适配逻辑，会主动读取集合内部存储的数据并展示出来，所以你能看到完整的Set内容。
• 但当Set/Map作为普通对象的属性被打印时，控制台默认只会遍历对象的可枚举自有属性。而Set/Map这类内置集合的内部数据并没有存在自身的可枚举属性里（你可以试试用for...in遍历一个Set，啥都拿不到），所以控制台就只能显示空对象{}。

为啥普通数组不会有这个问题？因为数组本身是类数组对象，自带length等可枚举属性，而且控制台也会对数组做特殊处理；但Set/Map是专门的集合结构，数据存储在内部插槽里，对外不暴露可枚举属性，自然就没法被常规的对象打印逻辑识别。

如果想正确打印包含Set的对象，可以把Set转成数组：

return { contas: [...this.COUNTS] };

或者用console.dir强制展开查看完整结构：

console.dir(x, { depth: null });

内容的提问来源于stack exchange，提问作者Marcus Vincius Fernandes Pavo