typescript-ts中的类(十)

基础

• 普通类

class Point{
  public x: number
  public y: number
  constructor(x: number,y: number){
    this.x = x
    this.y = y
  }
  public getPosition () {
    return `(${this.x},${this.y})`
  }
}
const point = new Point(1,3)
console.log(point.getPosition()) // (1,3)

• 继承类

class Parent{
  public name: string
  constructor(name: string){
    this.name = name
  }
}
class Child extends Parent{
  constructor(name: string){
    super(name)
  }
}

修饰符

public

public 修饰符   默认使用
public 修饰的属性和方法，在类里面或外面都可以通过实例访问 

private

private 修饰符    私有的
private 修饰的属性和方法，在类的外面不能访问

演示代码

// 父类
class Personp{
  private age: number
  constructor(age: number){
    this.age = age
  }
}
// 父类实例化
const person = new Personp(18)
console.log(person)// Personp {age: 18}
// error [属性“age”为私有属性，只能在类“Personp”中访问]
// console.log(person.age)


// 子类
class Childs extends Personp{
  constructor(age: number){
    super(age)
    // error  [属性“age”为私有属性，只能在类“Personp”中访问]
    // console.log(super.age)
  }
}
const child = new Childs(20)
console.log(child)// Childs {age: 20}
// error  [属性“age”为私有属性，只能在类“Personp”中访问]
// 子类的实例化对象不能访问父类的中使用private修饰的属性和方法
// console.log(child.age)

protected

protected 修饰符   受保护的
在父子类中，子类可以访问父类的受保护的方法，但是不能访问受保护的属性
在父类的构造方法前面添加protected修饰符修饰，父类不能创建实例化对象，只能通过子类创建

演示代码

• 属性和方法

// 父类
class Persons{
  public uname: string
  protected age: number
  private sex: string
  constructor(uname: string,age: number,sex: string){
    this.uname = uname
    this.age = age
    this.sex = sex
  }
  public getUname (){
    return `名字为${this.uname}`
  }
  protected getAge (){
    return `年龄为${this.age}`
  }
  private getSex (){
    return `性别为${this.sex}`
  }
}


// 子类
class Student extends Persons{
  constructor(uname: string,age: number,sex: string){
    super(uname,age,sex)
    console.log(super.uname) // underfined
    // 在父子类中，子类可以访问父类的受保护方法，但是不能访问受保护的属性
    // console.log(super.age)
    console.log(super.getUname()) // 名字为 张三
    console.log(super.getAge()) // 年龄为 18
    // error  [属性“sex”为私有属性，只能在类“Persons”中访问]
    // console.log(super.sex)
    // error   [属性“getSex”为私有属性，只能在类“Persons”中访问]
    // console.log(super.getSex())
  }
  getName() {
    return `${this.uname}`
  }
}
// 实例化对象
const stu = new Student('张三',18,'男')
console.log(stu.getName()) // 张三

• protected修饰构造方法

class Dog{
  protected uname: string
  // protected 修饰构造方法
  protected constructor(uname: string){
    this.uname = uname
  }
  protected getName(){
    return this.uname
  }
}

class Aik extends Dog{
  constructor(uname: string){
    super(uname)
  }
  getInfo(){
    console.log(super.getName()) // Tom
    console.log(super.uname) // underfined
  }
}

// error  [类“Dog”的构造函数是受保护的，仅可在类声明中访问]
// const Am = new Dog('Tom')


// 父类的构造方法使用protected修饰符修饰，只能用子类创建对象
const Anm = new Aik('Tom')
Anm.getInfo()

readonly修饰符

• readonly修饰属性，属性为只读属性

class UserInfo{
  readonly name: string
  constructor(name: string){
    this.name = name
  }
}
// readonly修饰属性，表示为只读属性，可以通过实例化对象来进行赋值，赋值后不能修改属性值
const infos = new UserInfo('lili')
console.log(infos)
// error  [无法分配到 "name" ，因为它是只读属性]
// infos.name = 'zs'

参数属性

代码演示

class Args{
  constructor(public name: string){}
}
const param = new Args('参数属性')
// 构造方法参数中  name属性前未使用public修饰
// console.log(param) // Args {}

// 构造方法参数中 name属性前使用public修饰
console.log(param)// args {'参数属性'}
console.log(param.name)// 参数属性

静态属性

代码演示

class StuInfo{
  // [public static]默认放在[private static]之前
  public static uname: string = 'ls'
  public static age: number = 18
  public static getUname(){
    return StuInfo.uname
  }
  constructor(){}
}

const stuInfo = new StuInfo()
// error  [属性“age”在类型“StuInfo”上不存在]
// console.log(stuInfo.age)
console.log(StuInfo.age) // 18

可选类属性

• 在属性名后面添加?

代码演示

class StudentInfo{
  public name: string
  public age?: number
  constructor(name: string,age?: number,sex?: string){
    this.name = name
    this.age = age
  }
}

// 属性名后添?，参数变成可变参数，在类实例化对象的时候，可变参数，可以根据实际情况选择，是否传入参数
// 可变参数即使在不传入参数的情况下，会默认给未传入的参数赋值undefined
const stInfo1 = new StudentInfo('ls')
const stInfo2 = new StudentInfo('ls',18)
const stInfo3 = new StudentInfo('ls',18,'女')

存取器

• typescript存取器等同于ES6中的存取器

class StudentInfo{
  public name: string
  public age?: number
  constructor(name: string,age?: number,sex?: string){
    this.name = name
    this.age = age
  }
  get infoStu() {
    return `${this.name}: ${this.age}`
  }
  set infoStu(value) {
    console.log(`setter: ${value}`) // 18
    this.name = value
  }
}

// 属性名后添?，参数变成可变参数，在类实例化对象的时候，可变参数，可以根据实际情况选择，是否传入参数
// 可变参数即使在不传入参数的情况下，会默认给未传入的参数赋值undefined

const stuInfox = new StudentInfo('zs',18,'男')
console.log(stuInfox.infoStu)// zs: 18
stuInfox.name = 'tq'
console.log(stuInfox.infoStu)// tq: 18

抽象类

• 抽象类被其他类继承，使用abstract定义抽象类

abstract class People {
  constructor(public name: string){}
  public abstract printName(): void
}

// 无法创建抽象类的实例
// const pl = new People()

class Man extends People{
  constructor(name: string){
    super(name)
    this.name = name
  }
  public printName(){
    console.log(this.name)
  }
}
const me = new Man('zs')
me.printName() // zs

• typescript 2.0以后，abstract不但可以修饰类和类中的方法，还可以修饰类中的属性和存取器

abstract class People {
  constructor(public name: string){}
  public abstract printName(): void
}

// 无法创建抽象类的实例
// const pl = new People()

class Man extends People{
  constructor(name: string){
    super(name)
    this.name = name
  }
  public printName(){
    console.log(this.name)
  }
}
const me = new Man('zs')
me.printName() // zs

实例类型

// 实例类型
class Cat{
  constructor(public name: string){}
}
let cat: Cat = new Cat('短美')


class Pig{
  constructor(public name: string){}
}
console.log(cat instanceof Pig) // false
cat = new Pig('黑猪')
console.log(cat instanceof Pig) // true

通过方法实例化

const create = <T>(c: new() => T): T => {
	return new c()
}
class Infox {
	public age: number
	constructor(){
		this.age = 18
	}
}
// 返回Infox类的实例对象
console.log(create<Infox>(Infox)) // Infox {age: 18}