TypeScript中已加载对象数组无法访问对象属性的原因排查

算力阿峰

2026-7-23

问题分析：控制台显示属性存在但访问返回undefined

以下是几种常见的原因及排查方案：

属性名大小写不一致
控制台显示的userName可能实际是username（小写n），部分浏览器控制台会自动格式化属性名显示，但实际对象的属性名是小写形式。可以执行Object.keys(resolvedMembers[0])打印所有属性名，确认真实的属性键名。
对象为类实例，属性非公开
如果UserModel是类，userName可能是私有/受保护属性，或者通过getter方法暴露而非直接挂载在对象上。可以尝试调用实例的getter方法（比如resolvedMembers[0].userName如果是getter的话），或者用Object.getOwnPropertyNames(resolvedMembers[0])查看实例自身的所有属性。
RxJS处理流程中丢失属性
在mergeMap/from/toArray的链式操作里，可能存在隐式转换导致属性丢失。比如如果处理时用了JSON.parse(JSON.stringify())这类序列化操作，会丢失类实例的方法和非枚举属性；或者loadServerMembers返回的Observable在转换过程中，没有正确保留UserModel的属性。
控制台快照与实际对象状态不一致
浏览器控制台的对象是引用类型，打印时显示的是当前最新状态，但你访问userName时，对象可能还未完成初始化，或者后续被异步操作修改。可以在访问前执行console.log(JSON.parse(JSON.stringify(resolvedMembers[0])))，查看此时对象的真实状态。
TypeScript类型断言错误
若你通过类型断言将普通对象强制转为UserModel类型，但实际对象并没有userName属性，TypeScript编译时不会报错，但运行时访问该属性会返回undefined。可以用console.log(resolvedMembers[0] instanceof UserModel)确认对象是否为UserModel的实例。