?: / readonly 可选与只读属性

最后更新：2026-10-22

? 把属性标记为可选（可以缺席），readonly 把属性标记为只读（赋值后不可再改）。对象类型里最常用的两个修饰符。

ℹ️ 说明 编辑器将 TypeScript 转译为 JavaScript 后运行（不做类型检查）；类型检查结果见示例 Output。

📝 语法

interface Config {
  readonly name: string; // 只读：赋值后不可改
  retries?: number;      // 可选：可以缺席
}

?:	可选标记：对象字面量里可以不写这个属性
readonly	只读标记：初始化后再赋值会编译报错（只在第一层生效）

返回值：无返回值——两个修饰符都是纯类型层概念，编译后消失。

修改下面的代码，点击试一试查看转译运行结果：

输出：

shop localhost 8080

（转译后运行输出；写 config.appName = "x" 会得到编译错误——appName 是只读）

ℹ️ 说明 可选属性的类型自动包含 undefined：retries?: number 在 strict 下等价于 retries?: number | undefined。

⚠️ 注意 readonly 只拦"重新赋值"这一层：readonly arr: number[] 仍可 push，嵌套对象的字段照样能改。深层只读要用 Readonly<T> 或 as const。

💡 提示 读取可选属性时用 ?? 提供默认值（config.port ?? 8080），别在业务代码里到处判 undefined。

更多案例即将上线。

Q readonly 和 const 有什么区别？

A const 管"变量绑定"（不能重新指向别的值），readonly 管"对象属性"（不能重新赋值该字段）。const obj 里的字段照样可改，除非字段标了 readonly。

Q 可选属性和类型写 T | undefined 有区别吗？

A 有：? 表示"属性可以整个缺席"；a?: T | undefined 表示"必须存在但值可以是 undefined"。开启 exactOptionalPropertyTypes 后两者严格区分。

Q 怎么让整个对象（含嵌套）都只读？

A Readonly<T> 只作用第一层；深层只读用 as const（锁死到字面量）或自写递归的 DeepReadonly 类型。

Web-Tutorial 技术团队

由多位开发者共同维护的编程教程平台。每篇教程由对应领域的开发者编写和审核，确保内容准确可靠。如发现任何问题，欢迎向我们反馈。