【typescript基础篇】(第五章) 类的使用

类的使用

类的基本使用

• 定义

  TypeScript 是面向对象的 JavaScript。

  类描述了所创建的对象共同的属性和方法。

  TypeScript 支持面向对象的所有特性，比如 类、接口等。

  TypeScript 类定义方式如下:

class class_name { 
 // 类作用域
}

定义类的关键字为 class，后面紧跟类名，类可以包含以下几个模块（类的数据成员）：

• 字段 − 字段是类里面声明的变量。字段表示对象的有关数据。
• 构造函数 − 类实例化时调用，可以为类的对象分配内存。
• 方法 − 方法为对象要执行的操作。

class Person {
  // 注意点: 需要先定义实例属性，才能够使用
  name: string
  age: number

  constructor(name: string, age: number){
    this.name = name;
    this.age = age;
  }

  sayHello(): void{
    console.log(`我的女神是${this.name}, 她今年${this.age}岁了, 但是在我心里她永远18岁!`);
  }

}

let p = new Person("邱淑贞", 54);
p.sayHello();

类的继承

TypeScript 支持继承类，即我们可以在创建类的时候继承一个已存在的类，这个已存在的类称为父类，继承它的类称为子类。

类继承使用关键字 extends，子类除了不能继承父类的私有成员(方法和属性)和构造函数，其他的都可以继承。

TypeScript 一次只能继承一个类，不支持继承多个类，但 TypeScript 支持多重继承（A 继承 B，B 继承 C）。

语法格式如下：class child_class_name extends parent_class_name

class Person {
  name: string
  age: number

  constructor(name: string, age: number) {
    this.name = name;
    this.age = age;
  }

  say():void{
    console.log(`我是${this.name}, 今年${this.age}岁`);
    
  }
}


class Student extends Person {
  score: string;

  constructor(name: string, age: number, score: string) {
    super(name, age);
    this.score = score;
  }

  say():void {
    // 调用父类的函数
    super.say();
    console.log(`我是重写之后的say方法, 我是学生${this.name}, 今年${this.age}岁了, 我的成绩为${this.score}`);
  }
}

let s = new Student("蒋依依", 18, "A");
s.say();

static与instanceof

• static 关键字用于定义类的数据成员（属性和方法）为静态的，静态成员可以直接通过类名调用。

• instanceof 运算符用于判断对象是否是指定的类型，如果是返回 true，否则返回 false。

// static关键字
// static 关键字用于定义类的数据成员（属性和方法）为静态的，静态成员可以直接通过类名调用。
class StaticTest {
  static salary: string;

  static say(): void {
    console.log("我们想要的工资是: " + StaticTest.salary);
    
  }
}

StaticTest.salary = "18k";
StaticTest.say();


// instanceof运算符
// instanceof 运算符用于判断对象是否是指定的类型，如果是返回 true，否则返回 false。
class Person{} 
let p = new Person() 
let isPerson = p instanceof Person; 
console.log("p 对象是 Person 类实例化来的吗？ " + isPerson); // true

class Student extends Person {}
let s = new Person() 
let isPerson2 = s instanceof Person; 
console.log("s 对象是 Person 类实例化来的吗？ " + isPerson2); // true

类中的修饰符

• public(默认)：公有，可以在任何地方被访问
• protected: 受保护，可以被其自身以及其子类访问
• private: 私有，只能被其定义所在的类访问。
• readonly: 可以使用 readonly关键字将属性设置为只读的。 只读属性必须在声明时或构造函数里被初始化。

class Person {
  public name: string;
  protected age: number;
  private sex: string;

  constructor(name: string, age: number, sex: string) {
    this.name = name;
    this.age = age;
    this.sex = sex;
  }

  say():void {
    console.log(`我的名字是${this.name},性别为${this.sex}, 今年${this.age}岁了,`);
  }
}

class Student extends Person {
  score: string
  constructor(name: string, age: number, sex: string, score: string) {
    super(name, age, sex);
    this.score = score;
  }
  show():void {
    console.log(this.name);
    console.log(this.age);
    // console.log(this.sex);
    console.log(this.score);
    
  }
}

let p = new Person("邱淑贞", 18, "女");
p.say();

let s = new Student("王心凌", 18, "女", "A");
s.show();


// readonly: 字段的前缀可以是 readonly 修饰符。这可以防止在构造函数之外对该字段进行赋值。
class PrintConsole {
  readonly str1: string = "HTML, CSS, JS, VUE REACT, NODE"
  readonly str2: string;
  readonly str3: string;
  readonly str4: string;

  constructor(str2: string, str3:string, str4:string) {
    this.str2 = str2;
    this.str3 = str3;
    this.str4 = str4;
  }
  // show():void {
  //   this.str2 = "123"
  // }
}

let pc = new PrintConsole("我的头发去哪了, 颈椎康复指南", 
                          "35岁失业该怎么办, 外卖月入一万也挺好", 
                          "活着") 

getter与setter

官方的另外一个名字: 存取器

通过getters/setters来截取对对象成员的访问

注意点:

如果存在 get ，但没有 set ，则该属性自动是只读的
如果没有指定 setter 参数的类型，它将从 getter 的返回类型中推断出来
访问器和设置器必须有相同的成员可见性

class GetNameClass {
  private _fullName: string = "倪妮"

  get fullName():string {
    console.log("我是get方法");
    return this._fullName
  }

  set fullName(newName:string) {
    console.log("我是set方法");
    this._fullName = newName;
  }
}


let starname = new GetNameClass();
starname.fullName = "袁冰妍"

console.log(starname);

console.log(starname.fullName);

抽象类与extends继承

• 定义

  抽象类做为其它派生类的基类使用。 它们一般不会直接被实例化

  抽象类是专门用于定义哪些不希望被外界直接创建的类的

  抽象类和接口一样用于约束子类

• 抽象类和接口区别

  抽象方法必须包含 abstract关键字并且可以包含访问修饰符

  接口中只能定义约束, 不能定义具体实现。而抽象类中既可以定义约束, 又可以定义具体实现

abstract class Person {
  abstract name: string;
  abstract show(): string;

  showName() {
    console.log(this.show());
  }
}


class Student extends Person {
  name: string = "孟子义";
  show():string {
    return "陈情令"
  }
}


// let p = new Person();
let s = new Student();
let res =  s.show();
console.log(res);

implements实现

• 类可以实现接口，使用关键字 implements
• 可以使用一个 implements 子句来检查一个类，是否满足了一个特定的接口。如果一个类不能正确地
  实现它，就会发出一个错误

注意点:

​ 实现一个带有可选属性的接口并不能创建该属性

​ 只要一个接口继承了某个类, 那么就会继承这个类中所有的属性和方法,但是只会继承属性和方法的声明, 不会继承属 性和方法实现

与extends的区别

extends: 继承某个类，继承之后可以使用父类的方法，也可以重写父类的方法

implements:继承某个类，必须重写才可以使用

/* 
  extend: 继承某个类，继承之后可以使用父类的方法，也可以重写父类的方法
  implements:继承某个类，必须重写才可以使用
*/

interface IPersonInfo {
  name: string;
  age: number;
  sex?: string; 
  show(): void;
}

interface IMusic {
  music: string
}

class Person implements IPersonInfo, IMusic {
  name: string = "吴谨言";
  age: number = 32;
  music: string = "雪落下的声音";
  show() {
    console.log(`${this.name}是'延禧攻略'的主演，她今年${this.age}岁了`);
    console.log(`${this.name}唱了一首歌叫 ${this.music}`);
    
  }
}
let p = new Person();
p.show();
// p.name = "周冬雨"
// p.sex = "女" // 报错


// 注意点: 只要一个接口继承了某个类, 那么就会继承这个类中所有的属性和方法
// 但是只会继承属性和方法的声明, 不会继承属性和方法实现

interface ITest extends Person {
  salary: number
}

class Star extends Person implements ITest {
  salary: number = 50;
  name: string = "关晓彤";
  age: number = 18;
}


let s = new Star();
console.log(s.salary);
console.log(s.name);

类的初始化顺序

• 基类的字段被初始化
• 基类构造函数运行
• 子类的字段被初始化
• 子类构造函数运行

/* 
  1.基类的字段被初始化
  2.基类构造函数运行
  3.子类的字段被初始化
  4.子类构造函数运行
*/

class Old {
  name: string = "林青霞"
  constructor() {
    console.log("我的名字是：" + this.name);
  }
}

class Young extends Old {
  name: string = "李子璇"
  constructor () {
    super()
    // console.log(this.name);
  }
}

let y = new Young();