TypeScriptの基礎的な知識(アクセス指定子)について学ぶ

学んだこと

readonly 修飾子

• 上書きすることが出来ないメンバ変数を指す

class Person {
  name: string;
  // 変数の前につける
  readonly id: number = 31

  // 引数設定時にアクセス指定子の後ろにつける
  constructor(public readonly name: string){
  }

  // thisにPersonを設定する
  greeting(this: Person){
    console.log(this.name)
  }
}

const quill = new Person("Quill");
const anotherQuill: {
  greeting: quill.greeting
}

anotherQuill.greeting();

継承

• extends を使うと継承することができる

class Person {
  name: string;

  // 引数設定時にアクセス指定子の後ろにつける
  constructor(name: string){
  }

  greeting(this: Person){
    console.log(this.name)
  }
}

// extendsの後に継承元のクラス名を設定する
class Teacher extends Person {
  // コンストラクタは継承元のクラスを呼ぶ
  // もし継承元のクラスの関数＋違う処理を付け加えたい場合は以下の様に行う
  constructor(name: string ){
    // ここでは継承元のクラスにあるconstructorを呼ぶ
    super(name);

    // なにか処理を付け加えたい場合はここに処理を書く

    // 継承元のクラスにある関数を使用したい場合
    super.継承元の関数名
  }
}
const teacher = new Teacher( "Quill")
teacher.greeting();

protected 修飾子

• 継承先、継承元で使える変数・関数になる
• 外部からはアクセス出来ない

ゲッター、セッターの作り方

• 関数名の前に get や set を記述する
• get
  • 値を取得する関数
  • 必ず戻り値に値を設定する
• set
  • 値を設定する関数
  • 必ず引数に値を設定する

class Person {
  name: string;

  // 引数設定時にアクセス指定子の後ろにつける
  constructor(name: string){
  }

  greeting(this: Person){
    console.log(this.name)
  }
}

class Teacher extends Person {
  // ゲッターは関数の前にgetをつける
  get subject(){
    // 何かしら戻り値を返す必要がある
    return "Music"
  }

  // 引数を必ず設定する
  set subject(value){
    this.subject = value
  }

  constructor(name: string ){
    super(name);

  }
}
const teacher = new Teacher( "Quill")
teacher.greeting();

static なクラスを作成する

• static はインスタンスを作成せずともクラスにアクセスできる
• static な変数や関数は this でアクセス出来ない

class Person {
  name: string;
  static species = "Homo sapiens"
  static isAdult(age: number){
    if(age > 17) return true;
    return false;
  }

  constructor(name: string){
  }

  greeting(this: Person){
    console.log(this.name)
  }
}

class Teacher extends Person {
  get subject(){
    return "Music"
  }

  set subject(value){
    this.subject = value
  }

  constructor(name: string ){
    super(name);

  }
}

// クラス名.変数
// クラス名.関数でアクセスすることができる
console.log(Parson.species);
console.log(Parson.isAdult(38))