5.0 TypeScript面向对象-类的简介

提起来面向对象这个概念，可能就老生常谈了，从我们接触JavaScript的时候，老师，课本就经常说一句话，在js中，一切皆对象！那么到底什么是面向对象呢？

想要面向对象，操作对象；那么首先我们需要有一个对象，那如何才能创造出一个对象？那就必须先定义一个类；所谓何为类？我们可以把它看做是一个模型，根据不同的模型创造出不同的东西，比如 人类的DNA会创造出一个人；猫咪的DNA会创造出一只猫咪;那么DNA就是这个类！

在TypeScript中关于类和js的相似，通过使用class来定义一个类。主要包含两个属性：属性和方法

定义实例属性-直接定义的属性就是实例属性，我们需要通过实例化得对象来进行属性的访问

class Person {
    name: string = 'xiaomi'
}

const per = new Person()
console.log(per.name)  //xiaomi

静态属性 / 类属性 --- 在属性前使用static关键字来定义类属性/静态属性，需要通过类来访问

class Person {
    static age: number = 18
}

const per = new Person()
// console.log(per.age)  //error 其实也不是error是undefined，我的ide会自动报红
console.log(Person.age) //18

只读属性

class Person {
    name: string = '李青'
    readonly gender: string = '男'
}

const per = new Person()
console.log(per.name)  //小米
console.log(per.gender)  //'男'
per.name = '艾希'
per.gender = '女'  //error
console.log(per.name)  //艾希
console.log(per.gender)  //'女'

也许你会看到控制台是已经修改成功了的，可能对这个进行了怀疑，但是请不要怀疑，请看你的控制台

 还可以扩展一下，静态的只读属性

class Person {
    static readonly id: string = 'B1502653265'  //静态的只读属性
}

const per = new Person()
console.log(Person.id)

实例化方法

class Person {
    name: string = '李青'
    static age: number = 26;

    getQSkill(): void {
        console.log(this.name) //在这里面我们可以用this来访问到其他的属性，比如name
        console.log(Person.age)  //但是对于静态属性，我们不能通过this访问，需要通过类来进行访问
        console.log('q技能天音波，回音击')
    }
}

const per = new Person()
per.getQSkill()

打印：

 静态方法

class Person {
    static getWSkill(): void {
        console.log('w技能金钟罩')
    }
}

const per = new Person()
// per.getWSkill()  //同样的，静态方法，是不能通过实例化对象来调用的，会告诉你这个方法是未定义
Person.getWSkill()  //success

先到这里，下篇继续。。。