Use of classes in TypeScript

Use of classes

The concept of classes in typescript is basically the same as in java and es6, there is no difference, the above example.

1. Definition and use of class

class Person {
    name = "小黑";
    age = 18;
    say() {
        return "我叫" + this.name
    }
}
const p = new Person();
console.log(p.say());

2. Class inheritance

The subclass inherits all the properties and methods of the parent class and can be called directly.

class Student extends Person{
    work(){
        return "淦！我是学生，我得学习。"
    }
}
const S = new Student();
console.log(S.say())
console.log(S.work())

3. Class rewriting and the use of super keyword

The subclass can override the method in the parent class. The writing method is to rewrite the method in the parent class. If we need to call the properties in the parent class, then we can call it through the super keyword.

class Student extends Person{
    work(){
        return "淦！我是学生，我得学习。"
    }
    // 重写父类中的say()方法
    say(){
        return super.say() + "很高兴认识你！"
    }
}
const S = new Student();
console.log(S.say())
console.log(S.work())

4. Class access type and read-only attributes

The access types of the class are public , private , protected

public

Typescript default access type, if you do not declare the access type when writing code, then typescript will default to the public type.
The public access type can be used inside and outside the class. For example, if we declare a variable inside the class, we can directly call the variable outside the class, or modify this variable.

class Person{
    public name:string;
    public say(){
        console.log(this.name)
    }
}
const p = new Person();
p.say() //第一次
p.name = "小白"
p.say() //第二次

The two output results indicate that the internal variables of the class have been modified by external operations.

private

The private type is just the opposite of the public above. It can be understood that as long as the braces of the class are out, no operation can directly call him (note that this is a direct call, and later we will have a method to manipulate the private type). I will show you an example.

protected

Protected type. This type is similar to private. It cannot be operated directly after the braces, but protected allows to be operated upon inheritance

class Person{
    protected name:string;
    public say(){
        console.log(this.name)
    }
}
class Student extends Person{
    name = "小黑";
    sayHello(){
        console.log(this.name)
    }
}
const p = new Student();
p.say()
p.sayHello()

Readonly attribute

When declaring a variable in a class, you can define the type of the variable. One of the attributes is called readonly. The variable with this attribute will report an error when trying to change its value.

class Person{
	public readonly name: string;
}

5. Class constructor

Ordinary constructor

There is a constructor method in the typescript class , which is our constructor. We can use this method to initialize the class, and the constructor in typescript is very convenient to write, as follows:

class Person {
    constructor(private name: string, public age: number) { }
}
const p = new Person("小黑", 21)
// console.log(p.name);     //这里记得name是私有变量，外部不能直接调用
console.log(p.age)

Subclass constructor

The constructor of the subclass is special. Since we have performed an inheritance extends operation, we must use super() when writing the constructor in the subclass , otherwise typescript will report an error.

class Student extends Person {
    constructor(private exam: number) { 
        super("小白",18);
    }
}

6. Class setter and getter

In the development process, in order to ensure the security of the data, we often define the data as private. If we want to call it, we will use the setter() method and getter() method or constructor method.

class Person {
    constructor(private name: string, private age: number) { }
    get getName() {
        return this.name
    }
    set setName(name: string) {
        this.name = name
    }
    get getAge() {
        return this.age
    }
    set setAge(age: number) {
        this.age = age
    }
}
const p = new Person("小黑", 21)
p.setName = "小白"
console.log(p.getName)

7. Use of abstract classes

Abstract class abstract energy introduced to facilitate the preparation of our class specification, the examples:
For example, we need to be reported out of school themselves that unit (class) is.

abstract class School{
    // 抽象类中的方法都需要加上abstract关键字，表示抽象方法
    abstract baobei()
}
class Student extends School{
    // 继承了抽象方法的类都必须对父类中的抽象方法进行具体化，具体跟类的重写是一样的
    baobei(){
        console.log("我是学生，是xx班的")
    }
}