TypeScript中支持的访问修饰符有哪些?

在 TypeScript 中,访问修饰符用于控制类的成员(属性和方法)的可访问性。TypeScript 支持三种主要的访问修饰符:publicprivateprotected。这些修饰符允许我们在类的外部或内部对成员的访问进行更细致的控制。

1. public 访问修饰符

public 是默认的访问修饰符。如果我们在类的成员前面不显式声明访问修饰符,则它默认为 publicpublic 成员可以在类的任何地方访问,包括类的外部。

示例:

typescript 复制代码
class Person {
  public name: string;

  constructor(name: string) {
    this.name = name;
  }

  public greet(): void {
    console.log(`Hello, ${this.name}`);
  }
}

const person = new Person("Alice");
console.log(person.name); // 输出:Alice
person.greet(); // 输出:Hello, Alice

在这个例子中,name 属性和 greet() 方法都使用了 public 访问修饰符,因此它们可以在类的外部被访问。

2. private 访问修饰符

private 修饰符表示该成员只能在类的内部访问,不能在类的外部或子类中访问。通过 private 修饰符,可以实现封装,将类的某些实现细节隐藏起来,防止外部代码直接访问或修改它们。

示例:

typescript 复制代码
class Car {
  private brand: string;

  constructor(brand: string) {
    this.brand = brand;
  }

  public getBrand(): string {
    return this.brand;
  }
}

const car = new Car("Toyota");
console.log(car.getBrand()); // 输出:Toyota
console.log(car.brand); // 错误:属性 'brand' 仅在类 'Car' 内部可访问

在这个例子中,brand 属性被声明为 private,因此在类的外部无法直接访问 brand,只能通过类中公开的方法(如 getBrand())访问。

3. protected 访问修饰符

protected 修饰符表示该成员可以在类的内部和继承它的子类中访问,但不能在类的外部访问。protected 成员可以通过继承和多态来扩展类的功能。

示例:

typescript 复制代码
class Animal {
  protected species: string;

  constructor(species: string) {
    this.species = species;
  }

  public makeSound(): void {
    console.log("Some sound");
  }
}

class Dog extends Animal {
  public speak(): void {
    console.log(`Woof! I am a ${this.species}`);
  }
}

const dog = new Dog("Dog");
dog.speak(); // 输出:Woof! I am a Dog
console.log(dog.species); // 错误:属性 'species' 仅在类 'Animal' 和其子类中可访问

在这个例子中,species 属性被声明为 protected,因此它不能在 Animal 类的外部直接访问,但在继承自 Animal 类的 Dog 类中可以访问。

4. 总结和最佳实践

  • public:任何地方都可以访问,包括类的外部。默认访问修饰符。
  • private:只能在类的内部访问,外部和子类都无法访问。适用于希望将某些实现细节封装起来的情况。
  • protected:可以在类的内部和继承它的子类中访问,但不能在外部访问。适用于希望允许子类访问某些属性或方法,但不允许外部直接访问的情况。

5. readonly 修饰符(补充)

除了 publicprivateprotected,TypeScript 还提供了 readonly 修饰符。readonly 用于修饰类的属性,表示该属性只能在类的构造函数中被赋值,之后无法修改。这对保护类的状态非常有用。

示例:

typescript 复制代码
class Point {
  public readonly x: number;
  public readonly y: number;

  constructor(x: number, y: number) {
    this.x = x;
    this.y = y;
  }
}

const point = new Point(10, 20);
console.log(point.x); // 输出:10
point.x = 30; // 错误:无法分配到 "x" ,因为它是只读属性

在这个例子中,xy 被声明为 readonly,因此它们只能在构造函数中赋值,之后无法修改。

6. 小结

TypeScript 中的访问修饰符(publicprivateprotected)允许开发人员控制类成员的可访问性,从而实现更好的封装和模块化。通过合理使用访问修饰符,可以确保类的设计更加清晰、可维护,同时保护类的内部实现不被外部不当访问或修改。

相关推荐
拉不动的猪8 分钟前
无缝适配 PC 和移动端‌我们要注意哪些点呢
前端·javascript·面试
酱酱们的每日掘金39 分钟前
🔥 4 月精选:AICoding Cursor上新与 MCP 实战揭秘!- AI Coding 周刊第 5 期
前端·ai编程·mcp
天天扭码1 小时前
一分钟解决 | 高频面试算法题——和为 K 的子数组(前缀和)
前端·算法·面试
搞瓶可乐1 小时前
鸿蒙ArkUI之布局实战,线性布局(Column,Row)、弹性布局(Flex)、层叠布局(Stack),详细用法
前端·harmonyos·鸿蒙系统·arkui·弹性布局·布局实战·堆叠布局
爱看书的小沐1 小时前
【小沐杂货铺】基于Three.JS绘制卫星轨迹Satellite(GIS 、WebGL、vue、react,提供全部源代码)
javascript·vue.js·webgl·three.js·卫星轨道·地球earth·satellite
Aphasia3112 小时前
小厂面试常考算法题整合(一)✍🏻
前端·算法·面试
五月仲夏2 小时前
React基础知识(补充中)
前端·react.js·前端框架
王富贵的记录2 小时前
React 函数组件和类组件的区别
前端·javascript·react.js
yuhaiqiang2 小时前
在公司写代码是工作,在开源社区写代码是生活
前端·后端
左耳咚2 小时前
Egg.js 服务端 HTML 强缓存问题排查与解决
前端·egg.js