※本ページではアフィリエイトリンク(PR)が含まれています※

TypeScript

【5分でわかる】アクセス修飾子の使い方 | TypeScript入門

この記事ではTypeScriptにおけるアクセス修飾子(private, protected, public)の使い方をご紹介します。

アクセス修飾子の使い方

TypeScriptにおけるアクセス修飾子の使い方をご紹介します!

アクセス修飾子とは?

アクセス修飾子とは、変数やメソッドに対しどのようなアクセス権限を付与できる機能です。

具体的には変数やメソッドの前にprivate, protected, public, (指定なし)の状態を設定することで実現できます。

public test: string;

public testMethod(test: number) { }

では、それぞれのアクセス修飾子がどのような意味を持つのかご紹介していきます。

public:誰でもアクセス可能

publicを設定することでどこからでも変数や、メソッドを利用(参照/変更)することができます。

例えば以下のように、TestAクラスで定義されたpublicな変数nameは、インスタンス化されたtestAにて変更することができます。

class TestA {
  public name: string;
}

const testA = new TestA("テスト");
testA.name = "テストA";

protected : 自分と子供だけアクセス可能

protectedを設定すると、自身のクラスと、そのクラスに紐づくサブクラスのみで参照/変更することが可能です。

サブクラスというのはextendsによって親クラスの内容を継承されたクラスのことです。

例えば、TestAクラスで定義されたprotectedな変数nameは、継承されたTestBにて変更することができます。

class TestA {
  protected name: string;
}

class TestB extends TestA {
  out(){
     console.log( super.name );
  }
}

const testB = new TestB("テスト");
testB.out; // テスト

上記コードでは継承したTestBのoutメソッドで親クラスのnameを出力しています。

private : 自分のクラスのみアクセス可能

privateに設定すると自分のクラスのみアクセス可能になります。そのため、自分のクラス以外からアクセスすることができなくなります。

例えば、TestAクラスで定義されたprivateな変数nameを、継承されたTestBにて参照するとエラーになります。

class TestA {
  private name: string;
}

class TestB extends TestA {
  out(){
     console.log( super.name ); // 親クラスのnameにアクセスできない
  }
}

const testB = new TestB("テスト");
testB.out; // エラー

まとめ

今回はTypeScriptにおけるアクセス修飾子(private, protected, public)を紹介しました。

ぜひこの機会に習得してみてください。

きむら

ここまで記事を読んでいただきありがとうございました♪