宁静的湖水【摘自QQ空间】

1、TypeScript中的类

回顾下JavaScript

大家都知道JavaScript中的继承通过原型(prototype)实现，跟大多数面向对象的一样，但是并非真正意义上的继承，我个人理解js中的继承其实就是对宿主对象创建一份副本，创建的实例化对象作为this去调用宿主对象进行初始化操作，拷贝一份副本给实例化对象，两者没有关联，如果宿主对象在新增任何成员都不会影响实例化对象。这样的解释虽然不够官方，但我个人认为更容易理解（多看几遍）

function Father(name) {

this.name = name;

}

//宿主对象添加house方法

Father.prototype.house = function () {

console.log(this.name, '继承房子遗产');

};

//宿主对象添加car方法

Father.prototype.car = function () {

console.log(this.name, "继承车遗产");

};

//实例化对象children2

let children = new Father('小刚');

//上一行代码实例化对象后，在宿主对象添加money属性

Father.prototype.money = '父亲的钱';

//在children对象也添加一个money属性

children.money = '儿子的钱!';

console.log(children.money);//打印输出: 儿子的钱!

结论：实例化对象children中的money和Father中money是互不相干的，查找的顺序是先从children对象中查找money属性，如果未找到，找寻找Father中的money属性值，实例化对象可以共享宿主对象的属性和方法。

在TypeScript的类底层实现原理就是基于JavaScript继承做的封装，我们来看看TypeScript中的类

用关键字class描述一个类

class Person  {

name: string;//属性name

age: string;//属性age

constructor(name: string, age: string) {

this.name = name;

this.age = age;

console.log(name, age);

 }

 //类方法

eat() {

console.log(this.name);

  }

} 

上面的Person 定义了三个成员：

2个类属性name、age;

1个类方法 eat;

实例化一个新对象的时候会执行构造函数，初始化name和age

需要注意的是：

如果类的属性和方法不加访问控制符则默认为public;

访问类的属性和方法都需要加this关键字；

2、类的三大特性

(1).封装

封装就是把类的属性和方法封装到类中，看代码

class Animai {

  name:string;

  eat() {//吃饭

  console.log(this.name,'吃东西');

     }

  sleep() {//睡觉

  console.log(this.name,'睡觉');

  }

  run() {//跑步

  console.log(this.name,'跑');

 }

constructor(name:string) {

this.name= name;

    }

}

封装了一个类属性和三个类方法，可以提供给其它类调用

(2).继承

继承的作用就是可以使类得到复用，提供给其它类继承，从而实现组件公用的特性，继承用extends来修饰，看看代码

//Animai类

class Animai {

  name: string;

  eat() {//吃饭

  console.log(this.name, '吃东西');

 }

 sleep() {//睡觉

 console.log(this.name, '睡觉');

 }

 run() {//跑步

 console.log(this.name, '跑步 ');

 }

constructor(name: string) {

this.name = name;

 }

}

class Dog extends Animai {

constructor(name: string) {

super(name); //继承name属性

super.run();//继承animai中的run方法

super.sleep();//继承animai中的sleep方法

super.eat();//继承animai中的eat方法

 }

}

new Dog('泰迪');

new Dog('牧羊犬');

这里Animai 类作为其它动物的父类，提供了一个公共的name属性和三个公共的方法eat、sleep、run，任务动物都可以继承animai类，从而实现代码复用

(3).多态

所谓多态，就是子类中可以继承父类的方法和属性，也可以重写父类的方法和属性

3、修饰符

(1).公共(public)

在TypeScript里，每个成员默认是public，不在属性或方法前面写public关键字默认就是public, 权限范围可以自由访问

看看代码：

class Car {

public name: string = '小明';

}

class Car2 {

a = new Car();

constructor() {

console.log(this.a.name);

 }

}

new Car2();

*在Car2中访问Car的name属性会成功输出构造函数中的console.log(this.a.name)并且打印输出：小明

结论：证实了在另一个类中访问类的属性和方法是可行的

(2).私有(private)

类属性和方法用private修饰符修饰的时候，权限范围只在当前类中才能访问

class Car {

private name: string = '小明';

 }

class Car2 {

a = new Car();

constructor() {

console.log(this.a.name);

 }

}

new Car2();

这里name属性用private修饰，如果在其它类中使用，编译器无法编译，直接报错，在本类中使用无任何问题，看下面代码

结论：用private修饰过的类属性和类方法，只有在当前类中有效，试图在其它类中访问会报错

(3).受保护(protected)

类属性和方法用protected修饰符修饰的时候，权限访问在子类中可以访问,这里通过继承来演示，看下面代码

class Person {

protected name;

constructor(name: string) {

this.name = name;

 }

}

class children extends Person {

constructor(name: string) {

super(name); //调用Person中的name属性

 }

say() {

console.log(this.name);

 }

}

let chil = new children("小明");

chil.say();

children 类继承Person类中的属性，name属性被protected 修饰，点用children中的say()方法时，能成功访问到name属性，打印输出

结论：证实了用protected修饰的属性是可以在子类中访问到的。

个人学习心得，大神路过 ，不喜勿喷😊  ，如果代码错误，麻烦告诉我。如果你觉得不错，欢迎点赞，订阅，分享出去给需要的人，笔者将非常感谢，如果有疑问请留言或者私信

<完>

如果你是喜欢看书的朋友，不妨点击【有惊喜】这是我在亚马逊买的电子书，都非常珍贵。希望你能喜欢

作者：小处成就大事

简介：一个喜欢分享和学习的前端开发程序猿，平时喜欢看看书，游泳，爬山，户外骑行等，期待与志同道合的你成为朋友，一起交流、一起进步。

初衷：闲时喜欢写一些文章分享，记录丰富自己。可能没有别人写得好，但是我写的每一篇都非常用心和投入。真心希望来到这里对你有所收获，我将非常开心很欣慰。

博客：小处成就大事_新浪博客

如果有志同道合的朋友不妨加微信一起交流和学习，期待你的到来