class 类基础(含存取器与静态成员)

最后更新:2026-10-22

class 类基础(含存取器与静态成员)

类把数据和操作打包:字段存状态、构造函数初始化、方法定义行为。new 创建实例,this 指向当前实例。TS 在 JS 类之上叠加字段类型标注与编译期检查,让"忘初始化""传错参"在写代码时就暴露。

分组函数与类
类型语法
严格模式不需要

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

📝 语法

class Book {
  title: string;   // 字段:显式类型
  author: string;
  copies: number;

  constructor(title: string, author: string, copies = 1) {
    this.title = title;
    this.author = author;
    this.copies = copies;
  }

  describe(): string {
    return `${this.title} - ${this.author}`;
  }
}

const book = new Book("三体", "刘慈欣", 3);

⚙️ 参数

constructor构造函数:new 时执行,负责把字段初始化到位
describe(): string方法:定义在原型上的行为;返回类型显式标注

返回值:方法显式标注返回类型;constructor 不写返回类型(它隐式返回新实例本身)。

▶ 示例

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

输出:

三体 - 刘慈欣 (3 本)

(转译后运行输出;new Book("三体", 123) 会得到编译错误——第二个参数必须是 string)

💡 要点

ℹ️ 说明 字段可以在声明处直接初始化并省掉构造函数赋值:copies: number = 1;类型也可由初始值推断。
💡 提示 "参数属性"是 TS 特色:constructor(public title: string) 声明参数的同时自动创建并初始化同名字段,等价于手写 this.title = title。
⚠️ 注意 strictPropertyInitialization 开启时,未在声明处或构造函数中赋值的字段会报错;可空字段写 title: string | undefined,确定后赋值用 definite assignment(!)。
更多案例即将上线。

📚 相关教程

❓ 常见问题

Q 字段类型可以省略吗?
A 声明处直接初始化时可以(copies = 1 推断为 number);只声明不初始化则必须标注,否则是隐式 any。
Q constructor 有返回类型吗?
A 不写也不能写——它隐式返回本类实例。TS 不允许为 constructor 声明返回类型,new 表达式的类型恒为类实例。
Q this 在回调里丢失怎么办?
A 用箭头函数字段(say = () => this.x)或在传回调前绑定;TS 还支持 this 参数(fn(this: Book))做编译期约束。
Web-Tutorial.com

Web-Tutorial 技术团队

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

100%

🙏 帮我们做得更好

我们是刚上线的编程教程站,几个人的小团队,精力有限。页面虽经检查,难免还有疏漏——链接失效、排版错乱、内容有误、语言生硬……

如果您发现了,麻烦告诉我们,我们会在收到反馈后第一时间进行修复,再次感谢您的光临 🙏