TS第三讲------ 类及其修饰符

1、定义一个类

class Person {
    // 定义属性
    name:string
    age:number
    gender:string
    // 定义构造函数：为了将来实例化对象的时候，可以直接对属性的值进行初始化
    constructor(name:string="小明",age:number=12,gender:string='男'){
        this.name = name
        this.age = age
        this.gender = gender
    }
    // 定义实例化方法
    sayHi(str:string){
        console.log(`${this.name},${this.age},${this.gender},${str}`)
    }

}

// ts中使用类
const person = new Person('Tony',12,'男')
person.sayHi('hello world!')
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21

2、类与类之间的关系-----继承extends

• A类继承了B类，那么A类叫子类(派生类)，B类叫父类(基类)
• 子类中可以调用父类中的方法，使用super方法

// 定义一个类，作为父类
class Person {
    // 定义属性
    name:string
    age:number
    gender:string
    // 定义构造函数：为了将来实例化对象的时候，可以直接对属性的值进行初始化
    constructor(name:string="小明",age:number=12,gender:string='男'){
        this.name = name
        this.age = age
        this.gender = gender
    }
    // 定义实例化方法
    sayHi(str:string){
        console.log(`${this.name},${this.age},${this.gender},${str}`)
    }

}

// 定义一个类，继承Person
class Student extends Person {
    constructor(name:string="小明",age:number=12,gender:string='男'){
        // 子类中可以调用父类中的方法，使用super方法
        super(name,age,gender)   
    }

    sayHi() {
        console.log('我是学生类中的sayHi方法')
        // 子类中可以调用父类中的方法，使用super方法
        super.sayHi('hello world!')   

        
    }
}

// 实例化
const person = new Person('Tony',38,'男')
person.sayHi('xxxxx')

const student = new Student('Gly',28,'女')
student.sayHi()
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41

3、类的修饰符

修饰符：类中成员的修饰符，主要是指类中成员(属性，构造函数、方法)的可访问性

3.1、修饰成员的可访问性

• public修饰符---- 公共的：类中成员的默认修饰符，代表是公共的，任何位置都可以访问类中的成员
• private修饰符—私有的：类中的成员如果使用private来修饰，那么外部是无法访问这个成员数据的,当然子类中也是无法访问该成员数据的
• protected修饰符—受保护的：类中的成员如果使用protected来修饰，那么外部是无法访问这个成员数据的,但是子类中是可以访问该成员数据的

// 定义一个类
class Person {
    // name:string
    // private name:string
    protected name:string

    constructor(name:string){
        this.name = name
    }
    public eat(){
        console.log(`${this.name},好吃`)   
    }

}

// 定义一个子类
class Student extends Person {
    constructor(name:string){
        super(name)
    }
    play(){
        // 当name为protected时，子类中也可访问；
        // 但如果其为private，子类中则无法访问
        console.log('like play',this.name)  
    }
}

const per = new Person('小明月')
// console.log(per.name)   // name 为私有，外部无法访问
per.eat()
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30

3.2、修饰成员的可修改性 ----- readonly

readonly修饰符：对类中的属性成员进行修饰，修饰后，

• 1、该属性成员，就不能在外部被随意修改了
• 2、类中的普通方法中，无法修改readonly修饰的成员属性值
• 3、类中constructor中，可以在初始化时修改readonly修饰的成员属性值

// 定义一个类
class Person {
    readonly name:string = "初始值"

    constructor(name:string){
        this.name = name   // constructor中是可以修改readonly修饰的值的
    }
    eat(){
        console.log(`${this.name},好吃`) 
        // 类中的普通方法中，也是不能修改readonly修饰的成员属性值   
        // this.name = "大知道"   
    }

}

const per = new Person('小明月')
console.log(per)
// per.name = "大明月"    // 此时，无法修改，因为name为只读的
per.eat()
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19

readonly 修饰类中的构造函数中的参数

class Person1 {
    // 构造函数中constructor中的参数,一旦使用public、readonly修饰后，那么相当于在该类中创建了一个该属性，并且用该修改符进行修饰；
    constructor(readonly name:string = '默认值'){
    
    }
}
const per1 = new Person1('小明月')
console.log(per1)
// per1.name = "大明月" 
1
2
3
4
5
6
7
8
9

4、存取器

存取器: 即通过 getters/setters 来截取对对象成员的访问。

• 如果只有get,没有set,则表明该属性只能读取，无法写入
• 如果只能set,没有get,则表明该属性只能写入，无法读取
• 同时设置get、set,此属性才能可读可写

class Person {
    firstName:string
    lastName:string
    
    constructor(firstName:string,lastName:string){
        this.firstName = firstName
        this.lastName = lastName
    }
    // 读取器
    get fullName(){
        console.log('get中......')
        return this.firstName+"_"+this.lastName
    }
    // 设置器
    set fullName(val){
        console.log('set中.......')
        let names = val.split('_')
        this.firstName = names[0]
        this.lastName = names[1]
    }
}

const person = new Person('陈','某某')
console.log(person)
// 获取属性
console.log(person.fullName)
// 设置属性值
person.fullName = "诸葛_孔明"   

// 注意：
// 如果只有get,没有set,则表明该属性只能读取，无法写入
// 如果只能set,没有get,则表明该属性只能写入，无法读取
// 同时设置get、set,此属性才能可读可写

console.log(person.fullName)
console.log(person.firstName,person.lastName)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36

5、静态成员 ----- static

• 静态成员：在类中通过static修饰的属性或方法，那么就称之为静态属性或静态方法
• 静态成员在使用时：类名.属性或方法来调用的

class Person {
    // 静态属性
    static name1:string = "默认值"
    
    // constructor是不能通过static来修饰的
    constructor(name:string){
        // 静态属性不能通过实例对象的方式去调用 
        // this.name = name


    }
    static say(){
        console.log(`hello world!`)
    }

    
}
// const person = new Person('陈某某')
// 通过实例对象调用的属性
// console.log(person.name1)

// 通过实例对象调用的方法
// person.say()

// 通过类名.静态属性的方式来设置/调用该属性的数据
console.log(Person.name1)
    //通过类名.静态方法的方式来调用该属性的静态方法
Person.say()
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28

6、抽象类 ----- abstract

抽象类：抽象类做为其它派生类的基类使用。 它们不能被实例化，其作用是为了让子类进行实例化及实现内部的抽象方法

abstract class Animal {
     // 抽象属性
     abstract name:string 

     // 抽象方法
     abstract eat()

     // 抽象方法不能有具体的实例，这里报错
     // abstract eat(){
     //     console.log(`hello world!`)
     // }

     // 实例方法
     say(){
         console.log('您好！')
     }

     
 }

 // 定义一个子类
 class Dog extends Animal {
     name:string = 'Tony'
     // 重新实现抽象类中的方法，那么此时这个方法就是当前类的实例方法
     eat() {
         console.log('dog eat。。。。。')
     }
 }

// 报错：抽象类是不能被实例化的
// const person = new Animal()

const dog = new Dog()
dog.eat()
// 调用的是抽象类中的实例方法
dog.say()   
console.log(dog.name)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37