typescript3

typescript

interface 接口

// 接口 interface
// 将组件中的重复注解做一个优化

// interface 和类型别名的区别
// interface name {} 必须是这种格式
// 而类型别名  type Girl =  string 可以被赋予一种类型
interface Girl {
  name: string,
  age: number,
  bust: number,
  wastline?: number  // 加？的作用 没有也不报错
}

let girl = {
  name: '洛璃',
  age: 18,
  bust: 88
}
const xuanba = (girl: Girl) => {
  girl.age < 24 && girl.bust < 90 && console.log(girl.name + '可以面试')
  girl.age >= 24 || girl.bust >= 90 && console.log(girl.name + '被刷掉')
}
const info = (girl: Girl) => {
  console.log(girl.name + girl.age + '岁')
  console.log(girl.name + girl.bust + '胸围')
  console.log(girl.name + girl.wastline + '腰围')  // 加？没有也不报错
}
xuanba(girl)
info(girl)

interface Girl {
  names: string,
  age: number,
  bust: number,
  wastline?: number,
  [propnames: string]: any,  // 可加多个，键为字符串，值为任意类型 （不限制接口再增加其余的键名）
  say(): string             // 限定对象方法的返回值
}

// 用接口限制类
// class Jiejie implements Girl {
//   constructor() {
//     this.names = '大脚';
//     this.age = 18;
//     this.bust = 94
//   }
//   names: '大脚';
//   age: 18;
//   bust: 94;
//   say() {
//     return '你好呀'
//   }
// }

// 接口继承 //继承以往限制的同时再增加一些自己的
interface Teacher extends Girl {
  teach(): string
}

let girl = {
  names: '大脚',
  age: 18,
  bust: 88,
  sex: '女',
  hobby: '羽毛球',
  say() {
    return '你好呀'
  },
  teach() {
    return '这学期我来教你们'
  }
}
const xuanba = (girl: Girl) => {
  girl.age < 24 && girl.bust < 90 && console.log(girl.names + '可以面试')
  girl.age >= 24 || girl.bust > 90 && console.log(girl.names + '被刷掉')
}

const info = (girl: Teacher) => {
  console.log(girl.names + girl.age + '岁')
  console.log(girl.names + girl.bust + '胸围')
  console.log(girl.names + girl.bust + '腰围')
  console.log(girl.names + girl.sex + '性别')
  console.log(girl.names + girl.hobby + '爱好')
}
xuanba(girl)
info(girl)

类

// 类

class Persons {
  constructor(count: string) {
    this.count = count
  }
  count: string
  say(): string {
    return this.count
  }
}


class Childs extends Persons {
  constructor(count: string, love: string) {
    super(count)
    this.love = love
  }

  love: string;
  // 对基类的方法进行重写
  say(): string {
    console.log('Childcount',this.count);
    return this.count + this.love
  };
}



const PerOne: Persons = new Persons('handsome man')

console.log('PerOne', PerOne.say());

const Children: Childs = new Childs('girl ', 'I Love You')

console.log('Children', Children);
console.log('基类的方法', Children.say());

类的访问类型

// public 公共的，类的内部和外部都能使用
// protected 受保护的，只能在基本类和它的子类内部访问
// private 私有属性 ，只能在基本类的内部访问

class Person {
  constructor() {
    this.name = ''
  }
  protected name: string
  public sayHello(): string {
    return 'hello'
  }
}

const person: Person = new Person()
// person.name = 'lll'


class Teacher extends Person {
  sayTeach() {
    return this.name
  }
}
// console.log(person.name);
console.log(person.sayHello());

const learn = new Teacher()
console.log('learn.sayTeach()', learn.sayTeach());

类的构造器

// 类的构造函数

class Aoteman {
  // public name: string
  // constructor(name: string) {
  //   this.name = name
  // }

  // 等价于  (简写)
  constructor(public name: string) { }
}

class DijiaAoteman extends Aoteman {
  constructor(name: string, public type: string) {
    // 派生类必须使用super
    super(name)
    // this.type = type
  }
}


const dijia = new DijiaAoteman('dijia', 'aoteman')
console.log(dijia.name); // dijia
console.log(dijia.type); // aoteman

const aote = new Aoteman('迪迦')

console.log(aote.name); // 迪迦

类的 get 、set 、static , readonly

// 类的get和set

class Niuheng {
  constructor(private age: number) { }
  get sayAge() {
    console.log('获得',this.age);
    return this.age - 10
  }
  set sayAge(sayAge: number) {
    console.log('sayAge',sayAge);
    this.age = sayAge + 5
  }
}

const erqiu = new Niuheng(23)
// 修改时触发set， 再触发get
erqiu.sayAge = 28
console.log('erqiu', erqiu.sayAge);

// 类的静态类型  static

class XiaoJiejie {
  static sayLove() {
    return "I Love You"
  }
}

const jiejie = new XiaoJiejie()

// 实例化对象无法访问静态类型
console.log('jiejie',jiejie);
// class静态类型直接通过类访问
console.log('静态类型',XiaoJiejie.sayLove());


// 只读属性

class Niuheng {
  public readonly _name: string
  constructor(name: string) {
    this._name = name
  }
}

const ren = new Niuheng('牛恒')

// 不能修改： 无法分配到 "_name" ，因为它是只读属性。ts(2540)
// ren._name = '牛哼'
console.log('ren', ren._name);