アクセス修飾子とは、publicprivateprotectedを使って、クラスがどこからアクセス可能かを指定する修飾子のことを言います。

次のクラスがあったとします。

class Profile {
  name: string
  age: number

  constructor(name: string, age: number) {
    this.name = name
    this.age = age
  }
}

let tanaka = new Profile("田中", 23)

tanaka.nameconsole.log();で確認してみます。

image2

『田中』が表示されました。

クラスから呼び出しを不用意に行わないようにするために、アクセス修飾子を使います。

例えば、名前を呼び出しをできるようにするには、name の型の前にpublicを使います。

class Profile {
  public name: string;
  private age: number;

image3

エラーが発生せず、name を呼び出せています。

反対に、年齢は呼び出してほしくないとした場合、ageの型の前に、privateを追加します。

class Profile {
  name: string;
  private age: number;

tanaka.ageconsole.log();で確認しようとすると、

image4

エラーが発生し、『プロパティ 'age' はプライベートで、クラス 'Profile' 内でのみアクセスできます。』と指摘されました。

privateを指定すると、age単体では、呼び出すことができなくなります。

ageは、classの中のみ呼び出すことができます。

例えば、Profile クラスの中に Message 関数を作成します。

class Profile {
  public name: string
  private age: number

  constructor(name: string, age: number) {
    this.name = name
    this.age = age
  }

  Message(): string {
    return `${this.name}さんは、${this.age}歳です。`
  }
}

こちらをconsole.log();で確認してみましょう。

image5

ageを呼び出すことができました。

ageProfileクラスからだけではなく、サブクラスからも呼び出しができるようにするには、protectedを使用します。

例えば、namepublicからprotectedに変えて、AnotherMessageというサブクラスを作ってみましょう。

class Profile {
  protected name: string
  private age: number

  constructor(name: string, age: number) {
    this.name = name
    this.age = age
  }

  Message(): string {
    return `${this.name}さんは、${this.age}歳です。`
  }
}

class AnotherMessage extends Profile {
  constructor(name: string, age: number) {
    super(name, age)
  }

  AnotherMessage(): string {
    return `今年${this.age}歳になる${this.name}さんです。`
  }
}

確認すると、

image6

this.nameにはエラーが発生していませんが、this.ageにはエラーが発生しています。

ageprotectedにすると、エラーが解消されます。

class Profile {
  protected name: string;
  protected age: number;

image7

エラーが解消されて、nameと age は、サブクラスから呼び出されるようになりました。

念のため、console.log();で確認すると、

let tanaka = new AnotherMessage("田中", 23)

console.log(tanaka.AnotherMessage())

image8

メッセージが表示されました。

ブログ一覧