通俗易懂TypeScript系列五：类(上)
宁静的湖水【摘自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修饰的属性是可以在子类中访问到的。
个人学习心得，大神路过 ，不喜勿喷😊 ，如果代码错误，麻烦告诉我。如果你觉得不错，欢迎点赞，订阅，分享出去给需要的人，笔者将非常感谢，如果有疑问请留言或者私信
<完>
如果你是喜欢看书的朋友，不妨点击【有惊喜】这是我在亚马逊买的电子书，都非常珍贵。希望你能喜欢
作者：小处成就大事
简介：一个喜欢分享和学习的前端开发程序猿，平时喜欢看看书，游泳，爬山，户外骑行等，期待与志同道合的你成为朋友，一起交流、一起进步。
初衷：闲时喜欢写一些文章分享，记录丰富自己。可能没有别人写得好，但是我写的每一篇都非常用心和投入。真心希望来到这里对你有所收获，我将非常开心很欣慰。
博客：小处成就大事_新浪博客
如果有志同道合的朋友不妨加微信一起交流和学习，期待你的到来
