This is the 20th day of my participation in the November Gwen Challenge. Check out the details: The last Gwen Challenge 2021

If you feel helpful, please click 👍 to encourage you

Define the class

  • Define a class using the CLAS keyword
class Person {}
Copy the code
  • Defining instance properties requires access through the instance of the object
class Person {
  name: String = 'hzw';
  age: number = 18;
}
const hzw = new Person();
console.log(hzw.name);//hzw
console.log(hzw.age);18
Copy the code
  • Use the static keyword to define static properties accessed through the class
class Person {
  static age: number = 20;
}
console.log(Person.age);/ / 20
Copy the code
  • Use the readonly keyword to define read-only properties
  • Static read-only properties can be defined using both static and readonly keywords. Static can only precede readonly
class Person {
  readonly color: string = 'red';
  static readonly height: string = '50px';
}
Copy the code
  • Defining instance methods need to be accessed through an instance of an object
class Person {
  sayHello(): void {
    console.log('hello'); }}const hzw = new Person();
hzw.sayHello();//hello
Copy the code
  • Use the static keyword to define static methods accessed through the class
class Person {
  static sayHello(): void {
    console.log('hello,static');
  }
}
Person.sayHello();//hello,static
Copy the code

The constructor

  • The constructor is called when the object is created
class Dog {
  constructor() {
   console.log("Constructor called.")}}const dog1 = new Dog();// The constructor is called
Copy the code
  • In the constructor, you can use this to add attributes to the newly created object
class Dog {
  name: String;
  age: number;
  constructor(name: string, age: number) {
    this.name = name;
    this.age = age; }}Copy the code
  • In instance methods,this represents the current instance, and in instance methods,this can be used to represent the object on which the method is currently called
class Dog {
  name: String;
  age: number;
  constructor(name: string, age: number) {
    this.name = name;
    this.age = age;
  }
  bark(): void {
    This can be used in instance methods to represent the object on which the method is currently called
    console.log(this); }}const dog1 = new Dog('black'.3);
dog1.bark();// Dog: Dog {name: "Dog ", age: 3}
Copy the code

inheritance

Inheritance makes it possible to write code common to multiple classes in a single parent class so that all subclasses have properties in the parent class at the same time, only once

  • Define a class that represents an Animal
 class Animal {
    name: String;
    age: number;
    constructor(name: string, age: number) {
      this.name = name;
      this.age = age;
    }
    bark(): void {
      console.log('The animal is calling); }}Copy the code
  • Define a Dog class that represents a Dog
  • Make Dog inherit from Animal
  • Animal is called the parent and Dog is called the subclass
  • Using inheritance, subclasses have all the attributes and methods of their parent class
class Dog extends Animal {}const dog = new Dog('prosperous wealth'.3);
console.log(dog);// Dog {name: "Dog ", age: 3}
dog.bark();// The animal is crying
Copy the code
  • Define a Cat class that represents a Cat
  • Make Cat inherit from Animal
class Cat extends Animal {}const cat = new Cat('white'.4);
console.log(cat);// Cat {name: "小白", age: 4}
cat.bark();// The animal is crying
Copy the code

Subclasses can add their own unique properties and methods

class Dog extends Animal {
  run() {
    console.log(`The ${this.name}In the run ~ ~ ~ `); }}const dog = new Dog('prosperous wealth'.3);
dog.run();// Fortune is running ~~~
Copy the code

rewrite

If a subclass adds the same method as the parent class, the subclass method overrides the parent class, which is called method override

class Dog extends Animal {
	bark(): void {
    console.log('Want want Want'); }}const dog = new Dog('prosperous wealth'.3);
dog.bark();/ / want want
Copy the code

super

In a class method,super represents the parent of the current class, and you can use super in subclasses to complete the reference to the parent

 class Animal {
    name: String;
    constructor(name: string) {
      this.name = name;
    }
    bark(): void {
      console.log('The animal is calling); }}// In a class method, super represents the parent of the current class
  class Dog extends Animal {
    bark() {
      super.bark(); }}const dog = new Dog('prosperous wealth');
dog.bark();// The animal is crying
Copy the code

When a subclass inherits a parent class, it must call the constructor of the parent class if the subclass also defines a constructor!

 // In a class method, super represents the parent of the current class
  class Dog extends Animal {
    age: number;
    constructor(name: string, age: number) {
      // Call the parent constructor
      super(name);
      this.age = age; }}Copy the code