TypeScriptでクラス建設者をつくる方法?


Originally posted here!
TypeScriptでクラスコンストラクタを作成するには、キーワードを使用できますconstructor インサイドclass 後に続く() シンボル(括弧を閉じて開きます)、そして{} シンボル.

TLドクター


// a simple class
class Person {
  name: string;
  age: number;

  // constructor for this class and
  // using parameter names that are
  // similar to the class field names
  // and then assigning it to the class fields
  // using the `this` keyword
  constructor(name: string, age: number) {
    this.name = name;
    this.age = age;
  }
}

// create an instance of the `Person` class
// and pass the values for the `name` and `age` fields
// through the brackets
const john = new Person("John Doe", 23);

// log the contents inside the `john` object
console.log(john); // {name: 'John Doe', age: 23} ✅
例えば、クラスを作成しましょうPerson いくつかの分野でname を持つstring 種類age を持つnumber 種類
こうすることができます.
// a simple class
class Person {
  name: string;
  age: number;
}
我々がクラスをつくった今、我々は価値を与える必要がありますname and age クラスのインスタンスを作成する際のクラスPerson クラス.そのためにはconstructor そして、フィールドに必要な値をconstructor のインスタンスを作成するとPerson 使用するクラスnew キーワード.
The constructor このようになります.
// a simple class
class Person {
  name: string;
  age: number;

  // constructor for this class
  constructor() {
    // cool code goes here
  }
}
上記のコードからわかるようにconstructor のためにPerson しかし、クラスのフィールドに値を設定するには?
我々は、利用することによってそれを行うことができますconstructor パラメータブラケット.パラメータブラケットのパラメータ名を、必要とする型で書くことができます.これは関数パラメータの使用法と同様です.パラメタブラケットにパラメタを書いた後に、我々はパラメタの値をthis キーワード.
こうすることができます.
// a simple class
class Person {
  name: string;
  age: number;

  // constructor for this class
  // using parameter names that are
  // similar to the class field names
  // and then assigning it to the class fields
  // using the `this` keyword
  constructor(name: string, age: number) {
    this.name = name;
    this.age = age;
  }
}
The this 上のコードではpointer 作成したクラスのインスタンスにthis.name and this.age インスタンスオブジェクトフィールドを参照してください.
最後に、Person 使用するクラスnew キーワードと値John Doe のためにname パラメータと23 のためにage パラメータを括弧で返します.
こうすることができます.
// a simple class
class Person {
  name: string;
  age: number;

  // constructor for this class
  // using parameter names that are
  // similar to the class field names
  // and then assigning it to the class fields
  // using the `this` keyword
  constructor(name: string, age: number) {
    this.name = name;
    this.age = age;
  }
}

// create an instance of the `Person` class
// and pass the values for the `name` and `age` fields
// through the brackets
const john = new Person("John Doe", 23);
の内容をログ出力する場合はjohn オブジェクトを出力します.
// a simple class
class Person {
  name: string;
  age: number;

  // constructor for this class and
  // using parameter names that are
  // similar to the class field names
  // and then assigning it to the class fields
  // using the `this` keyword
  constructor(name: string, age: number) {
    this.name = name;
    this.age = age;
  }
}

// create an instance of the `Person` class
// and pass the values for the `name` and `age` fields
// through the brackets
const john = new Person("John Doe", 23);

// log the contents inside the `john` object
console.log(john); // {name: 'John Doe', age: 23} ✅
上記からのログは、クラスのインスタンスを首尾よく作成しましたPerson 値を指定します.矢🥳!
上のコードはcodesandbox .
それで😃!

お気軽に共有する場合は、この便利な発見😃.