TypeScript访问未定义对象属性未报错，为何输出undefined？

你的代码之所以没抛出运行时错误，核心原因在于非空断言操作符!只作用于TypeScript的类型检查阶段，编译后会被完全移除，不会在运行时添加任何空值检查逻辑。

拆解你的代码执行流程：

• config.layers?.find((layer) => layer.id === 'blah')：因为不存在id为'blah'的layer，find返回undefined，加上可选链?.，这部分最终结果是undefined。
• ?.dataSource：可选链的特性就是当左侧值为null/undefined时，会直接短路返回undefined，不会尝试访问后面的dataSource，自然不会抛出Cannot read properties of undefined的错误。
• 最后的!：只是告诉TypeScript编译器“这个值绝对不是null/undefined”，但编译后的JS代码里不会有任何对应的检查逻辑，所以最终testResult就是undefined。

你的tsconfig配置和这个运行时行为无关——非空断言的编译后行为是TypeScript的既定规则，和ESLint或TS的配置项没有关系。如果想要在运行时触发错误，你需要去掉可选链?.，改成直接访问：

const testResult = config.layers.find((layer) => layer.id === 'blah').dataSource!;

这样当find返回undefined时，访问dataSource就会抛出运行时错误。

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