类与枚举

• 类(Class): 定义了一切事物的抽象特点
• 对象(Object): 类的实例
• 面向对象(OOP)三大特征：封装、继承、多态

js 中的类

class Animal {
  constructor(name) {
    this.name = name
  }
  run() {
    return `${this.name} is running`
  }
}

const snake = new Animal('lily')
console.log(snake.run())    // lily is running

class Dog extends Animal {
  bark() {
    return `${this.name} is barking`
  }
}

const xiaobao = new Dog('xiaobao')
console.log(xiaobao.run())  // xiaobao is running
console.log(xiaobao.bark())  // xiaobao is barking


class Cat extends Animal {
  static categories = ['mammal']
  constructor(name) {
    super(name)
    console.log(this.name)
  }
  run() {
    return 'Meow, ' + super.run()
  }
}

const mamomao = new Cat('maomao')
console.log(mamomao.run())
console.log(Cat.categories)
// maomao
// Meow,maomao is running
// [ 'mammal' ]

ts 中的类

• Public: 修饰的属性或方法是共有的
• Private: 修饰的属性或方法是私有的
• Protected: 修饰的属性或方法是受保护的

class Animal {
  name: string;
  // readonly name: string;
  constructor(name) {
    this.name = name
  }
  // private run() {
  //   return `${this.name} is running`
  // }
  // protected run() {
  //   return `${this.name} is running`
  // }
  run() {
    return `${this.name} is running`
  }
}
const snake = new Animal('lily')
console.log(snake.run())

// snake.name = '123'

class Dog extends Animal {
  bark() {
    return `${this.name} is barking`
  }
}

const xiaobao = new Dog('xiaoxiao')
console.log(xiaobao.run())
console.log(xiaobao.bark())

class Cat extends Animal {
  static categories = ['mammal']
  constructor(name) {
    super(name)
    console.log(this.name)
  }
  run() {
    return 'Meow, ' + super.run()
  }
}

const mamomao = new Cat('maomao')
console.log(mamomao.run())
console.log(Cat.categories)

类和接口

• 继承的困境
• 类可以使用 implements 来实现接口

class Car {
  switchRadio(trigger: boolean) {

  }
}

class Cellphone {
  switchRadio(trigger: boolean) {

  }
}

interface Radio {
  switchRadio(trigger: boolean): void
}

class Car implements Radio {
  switchRadio(trigger: boolean) {

  }
}

class Cellphone implements Radio {
  switchRadio(trigger: boolean) {

  }
}

interface Radio {
  switchRadio(trigger: boolean): void
}

interface Battery {
  checkBatteryStatus(): void;
}

class Car implements Radio {
  switchRadio(trigger: boolean) {

  }
}

class Cellphone implements Radio, Battery {
  switchRadio(trigger: boolean) {

  }
  checkBatteryStatus() {

  }
}

interface Radio {
  switchRadio(trigger: boolean): void
}

interface Battery {
  checkBatteryStatus(): void;
}

interface RadioWithBattery extends Radio {
  checkBatteryStatus(): void;
}

class Car implements Radio {
  switchRadio(trigger: boolean) {

  }
}

class Cellphone implements RadioWithBattery {
  switchRadio(trigger: boolean) {

  }
  checkBatteryStatus() {

  }
}

枚举

enum Direction {
  Up,
  Down,
  Left,
  Right,
}
console.log(Direction.Up)  // 0
console.log(Direction[0])  // Up

enum Direction {
  Up = 10,
  Down,
  Left,
  Right,
}

console.log(Direction.Down)  // 11

查看编译出的代码:

var Direction;
(function (Direction) {
    Direction[Direction["Up"] = 0] = "Up";
    Direction[Direction["Down"] = 1] = "Down";
    Direction[Direction["Left"] = 2] = "Left";
    Direction[Direction["Right"] = 3] = "Right";
})(Direction || (Direction = {}));
console.log(Direction.Down);

enum Direction {
  Up = 'UP',
  Down = 'DOWN',
  Left = 'LEFT',
  Right = 'RIGHT',
}

const value = 'UP'
if (value === Direction.Up) {
  console.log('go up!')
}
// go up!

常量枚举

const enum Direction {
  Up = 'UP',
  Down = 'DOWN',
  Left = 'LEFT',
  Right = 'RIGHT',
}

const value = 'UP'
if (value === Direction.Up) {
  console.log('go up!')
}

编译后的内容：

var value = 'UP';
if (value === "UP" /* Up */) {
    console.log('go up!');
}