javascript - class

dynamic typing language
JAvascriptは実行時にタイプを決定するので、タイプに注意してください.
classには、フレームを使用して印刷されたデータ(instance)が含まれています.

getter / setter

class User {
  constructor(name, age){
    this.name = name;
    this.age = age
  }
  get age(){
     return this._age
  }
  
  set age(value){
    this._age = value < 0 ? 0 : value;
  }
}
const user1 = new User("dongha", -1)
console.log(user1.age) // 0

classユーザーのミスを補うためにget()で値を返し、set()で値を設定します.getterとsetterでは、変数名が少し異なります.

static

class Article {
  static publicher = "dongha"
  
  constructor(articleNumber){
    this.articleNumber = articleNumber
  }

  static printPublisher(){
    console.log(Article.publicher)
  }
}

const article1 = new Article(1)
const article2 = new Article(2)

console.log(article1.publicher) // undefined
console.log(Article.publicher) // 1
Article.printPublicher() // dongha

静的はクラスに関係ありません.article1.publisherを作ると不確実ですstaticはobjectに割り当てられるのではなく、クラスに割り当てられるからです.objectにかかわらず,共同で使用する方法は静的であることが望ましい.

継承と多様性

class Shape {
  constructor(width, height, color){
    this.width = width;
    this.height= height;
    this.color = color;
  }
  draw(){
    console.log(`drawing ${this.color} color of`)
  }

  getArea(){
    return this.width * this.height
  }
}
class Rectangle extends Shape {}
class Triangle extends Shape {}

const rectangle = new Rectangle(20,20,"blue")
rectangle.draw()  // drawing blue color of

const triangle = new Triangle(20,20,"red")

Class Shapeには、基本データとdrwa()、getArea()メソッドがあります.class Rectangle shapeの情報を取得するにはextendsを行います.次に、コンストラクション関数を使用してオブジェクトを作成し、インスタンスにdraw()メソッドを出力すると、指定した値が得られます.

class Triangle extends Shape {}

const triangle = new Triangle(20,20,"red")
console.log(triangle.getArea()) // 200

Instance三角形のareaはShapeのgetArea()では求められません.必要な関数のみを再定義します.
overriding

class Triangle extends Shape {
  getArea(){
    return (this.width * this.height) / 2;
  }
}

const triangle = new Triangle(20,20,"red")
console.log(triangle.getArea()) // 200

上書きすると、親関数は呼び出されません.だからスーパー.親の関数で呼び出せばいいです.

instanceOf

instanceはclassから来たかどうかをチェックします.true/falseを返します
ソース:https://www.youtube.com/watch?v=OCCpGh4ujb8&list=PLv2d7VI9OotTVOL4QmPfvJWPJvkmv6h-2&index=3