5万字 TypeScript入门系列（第三期）（建议收藏）

console.log(name=${this.name});

}

protected sayAge():void{

console.log(age=${this.age});

}

private sayGender():void{

console.log(gender=${this.gender});

}

say():void{

this.sayName();

this.sayAge();

this.sayGender();

}

}

class Student extends Person {

constructor(name: string, age: number, gender: string) {

super(name, age, gender);

}

say():void{

this.sayName();

this.sayAge();

this.sayGender();

}

}

let p = new Person(‘lnj’, 34, ‘male’);

p.say();

p.sayName();

p.sayAge();

p.sayGender();

let stu = new Student(‘zs’, 18, ‘female’);

stu.say();

*/

/*

需求: 有一个基类, 所有的子类都需要继承于这个基类, 但是我们不希望别人能够通过基类来创建对象

• */

/*

class Person {

name:string;

age:number;

gender:string;

protected constructor(name:string, age:number, gender:string){

this.name = name;

this.age = age;

this.gender = gender;

}

say():void{

console.log(name=${this.name},age=${this.age},gender=${this.gender});

}

}

class Student extends Person {

constructor(name: string, age: number, gender: string) {

super(name, age, gender);

}

}

let p = new Person(‘lnj’, 34, ‘male’);

let stu = new Student(‘zs’, 18, ‘female’);

*/

4. 类可选属性与参数属性

• 可选属性

• 和接口中的可选属性一样, 可传可不传的属性

class Person {

// 注意点: 在TS中如果定义了实例属性, 那么就必须在构造函数中使用, 否则就会报错

name:string;

age?:number; // 可选属性

constructor(name:string, age?:number){

this.name = name;

this.age = age;

}

// setNameAndAge(name:string, age:number){

// this.name = name;

// this.age = age;

// }

}

let p = new Person(‘lnj’);

console.log§;

• 参数属性

• 搞定实例属性的接收和定义

/*

class Person {

name:string;

age:number;

constructor(name:string, age?:number){

this.name = name;

this.age = age;

}

}

• */

class Person {

constructor(public name:string,public age:number){

}

}

let p = new Person(‘lnj’, 34);

console.log§;

5. 类存取器

• 什么是存取器?

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

class Person {

private _age:number = 0;

set age(val:number){

console.log(‘进入了set age方法’);

if(val<0){

throw new Error(‘人的年龄不能小于零’);

}

this._age = val;

}

get age():number{

console.log(‘进入了get age方法’);

return this._age;

}

}

let p = new Person();

p.age = 34;

// p.age = -6; // p.age(-6);

console.log(p.age);

6. 抽象类

• 什么是抽象类?

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

抽象类一般用于定义基类

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

• 抽象类和接口区别?

• 接口中只能定义约束, 不能定义具体实现

而抽象类中既可以定义约束, 又可以定义具体实现

class Person {

name:string;

age: number;

protected constructor(name:string, age:number){

this.name = name;

this.age = age;

}

}

class Student extends Person{

constructor(name:string, age:number){

super(name, age);

}

}

// let p = new Person(‘lnj’, 34);

let stu = new Student(‘lnj’, 34);

console.log(stu);

*/

abstract class Person {

abstract name:string;

abstract say():void;

eat():void{

console.log(${this.name}正在吃东西);

}

}

// let p = new Person();

class Student extends Person{

name:string = ‘lnj’;

say():void{

console.log(我的名字是${this.name});

}

}

let stu = new Student();

stu.say();

stu.eat();

7. 类与接口

// 类"实现"接口

/*

interface PersonInterface {

name:string;

say():void;

}

// 只要实现的某一个接口, 那么就必须实现接口中所有的属性和方法

class Person implements PersonInterface{

name:string = ‘lnj’;

say():void{

console.log(我的名字叫:${this.name});

}

}

let p = new Person();

p.say();

*/

// 接口"继承"类

class Person {

// protected name:string = ‘lnj’;

name:string = ‘lnj’;

age:number = 34;

protected say():void{

console.log(name = ${this.name}, age = ${this.age});

}

}

// let p = new Person();

// p.say();

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

// 但是只会继承属性和方法的声明, 不会继承属性和方法实现

// 注意点: 如果接口继承的类中包含了protected的属性和方法, 那么就只有这个类的子类才能实现这个接口

interface PersonInterface extends Person{

gender:string;

}

class Student extends Person implements PersonInterface{

gender:string = ‘male’;

name:string = ‘zs’;

age:number = 18;

say():void{

console.log(name = ${this.name}, age = ${this.age}, gender = ${this.gender});

}

}

let stu = new Student();

stu.say();

8. 类与泛型

// 泛型类

class Chache {

arr:T[] = [];

add(value:T):T{

this.arr.push(value);

return value;

}

all():T[]{

return this.arr;

}

}

let chache = new Chache();

chache.add(1);

chache.add(3);

chache.add(5);

console.log(chache.all());

9. 接口合并现象

// 当我们定义了多个同名的接口时, 多个接口的内容会自动合并

interface TestInterface {

name:string;

}

interface TestInterface {

age:number;

}

/*

interface TestInterface {

name:string;

age:number;

}

• */

class Person implements TestInterface{

age:number = 19;

name:string = ‘lnj’;

}

码字不易，在线求个三连支持。

总结:

• 函数式编程其实是一种编程思想，它追求更细的粒度，将应用拆分成一组组极小的单元函数，组合调用操作数据流；

• 它提倡着 纯函数 / 函数复合 / 数据不可变， 谨慎对待函数内的 状态共享 / 依赖外部 / 副作用；

Tips:

其实我们很难也不需要在面试过程中去完美地阐述出整套思想，这里也只是浅尝辄止，一些个人理解而已。博主也是初级小菜鸟，停留在表面而已，只求对大家能有所帮助，轻喷🤣；

我个人觉得: 这些编程范式之间，其实并不矛盾，各有各的 优劣势。

理解和学习它们的理念与优势，合理地 设计融合，将优秀的软件编程思想用于提升我们应用；

所有设计思想，最终的目标一定是使我们的应用更加 解耦颗粒化、易拓展、易测试、高复用，开发更为高效和安全；