JavaScript对象出现额外t字符的原因及普通对象转对应格式的方法

为什么会出现带额外t的对象结构 #

常见分两种情况：

• 运行期真实存在的t属性：一般是工具库、业务框架、序列化协议（如ProtoBuf、FlatBuffers）为了做类型校验、序列化/反序列化识别，主动给对象挂载的类型标识字段；也可能是自定义类的实例在构造时主动添加的标记属性。
• 仅控制台显示的t标识：部分版本的浏览器控制台会给特殊对象（如Proxy代理对象、冻结对象、带私有属性的对象）加灰色的前缀标记，这类t仅为控制台的UI提示，不属于对象本身的真实属性。

普通对象转换为该结构的方法 #

根据场景不同对应两种实现方式：

场景1：需要给对象添加真实的t属性 #

直接扩展原对象即可，示例代码如下：

// 原始普通对象
const originalObj = {
    key: "training",
    amount: 4500,
    currency: "PLN",
    label: "Training",
};

// 扩展添加t属性，属性值替换为对应场景需要的标识即可
const convertedObj = {
    ...originalObj,
    t: "your_custom_type_tag"
};

场景2：需要生成带类标识的实例对象 #

如果是自定义类的实例带t属性，先定义类再实例化即可：

// 自定义业务类，提前定义t标识
class CustomBizObject {
    // 固定的t标记值
    t = "biz_data_type";
    constructor(props) {
        // 把传入的属性挂载到实例上
        Object.assign(this, props);
    }
}

// 实例化得到目标结构
const convertedObj = new CustomBizObject({
    key: "training",
    amount: 4500,
    currency: "PLN",
    label: "Training",
});

如果是需要浏览器控制台显示t前缀的效果，只要把普通对象用Object.freeze()冻结或者用Proxy代理即可，这个效果仅在控制台可见，不会修改对象实际结构。 #

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